opin-ui 0.0.1

package/README.md

@@ -0,0 +1,5 @@
+# Fumadocs UI
+
+The React.js docs framework.
+
+[Read Documentation](https://fumadocs.dev/docs/ui)

package/css/aspen.css

@@ -0,0 +1,39 @@
+@import './lib/default-colors.css';
+
+@theme {
+  --color-fd-background: hsl(75, 45%, 96%);
+  --color-fd-foreground: hsl(75, 35%, 18%);
+  --color-fd-primary: hsl(80, 60%, 40%);
+  --color-fd-primary-foreground: hsl(80, 100%, 16%);
+  --color-fd-border: hsla(80, 35%, 70%, 0.5);
+  --color-fd-ring: hsl(80, 60%, 40%);
+  --color-fd-accent: hsl(75, 50%, 90%);
+  --color-fd-accent-foreground: hsl(80, 60%, 22%);
+  --color-fd-muted: hsl(75, 40%, 92%);
+  --color-fd-muted-foreground: hsl(75, 25%, 45%);
+  --color-fd-secondary: hsl(80, 45%, 88%);
+  --color-fd-secondary-foreground: hsl(80, 50%, 18%);
+  --color-fd-card: hsl(75, 45%, 94%);
+  --color-fd-card-foreground: hsl(75, 35%, 18%);
+  --color-fd-popover: hsl(75, 45%, 97%);
+  --color-fd-popover-foreground: hsl(75, 35%, 18%);
+}
+
+.dark {
+  --color-fd-background: hsl(80, 25%, 7%);
+  --color-fd-foreground: hsl(75, 35%, 88%);
+  --color-fd-primary: hsl(80, 60%, 55%);
+  --color-fd-primary-foreground: hsl(80, 35%, 8%);
+  --color-fd-border: hsla(80, 35%, 35%, 0.35);
+  --color-fd-ring: hsl(80, 60%, 55%);
+  --color-fd-accent: hsl(80, 25%, 18%);
+  --color-fd-accent-foreground: hsl(80, 60%, 75%);
+  --color-fd-muted: hsl(80, 25%, 12%);
+  --color-fd-muted-foreground: hsl(75, 25%, 65%);
+  --color-fd-secondary: hsl(80, 25%, 16%);
+  --color-fd-secondary-foreground: hsl(75, 35%, 88%);
+  --color-fd-card: hsl(80, 25%, 10%);
+  --color-fd-card-foreground: hsl(75, 35%, 88%);
+  --color-fd-popover: hsl(80, 25%, 8%);
+  --color-fd-popover-foreground: hsl(75, 35%, 88%);
+}

package/css/black.css

@@ -0,0 +1,39 @@
+@import './lib/default-colors.css';
+
+@theme {
+  --color-fd-background: hsl(0, 0%, 98%);
+  --color-fd-foreground: hsl(0, 0%, 3.9%);
+  --color-fd-muted: hsl(0, 0%, 96.1%);
+  --color-fd-muted-foreground: hsl(0, 0%, 45.1%);
+  --color-fd-popover: hsl(0, 0%, 100%);
+  --color-fd-popover-foreground: hsl(0, 0%, 15.1%);
+  --color-fd-card: hsl(0, 0%, 99.7%);
+  --color-fd-card-foreground: hsl(0, 0%, 3.9%);
+  --color-fd-border: hsla(0, 0%, 60%, 0.2);
+  --color-fd-primary: hsl(0, 0%, 9%);
+  --color-fd-primary-foreground: hsl(0, 0%, 98%);
+  --color-fd-secondary: hsl(0, 0%, 96.1%);
+  --color-fd-secondary-foreground: hsl(0, 0%, 9%);
+  --color-fd-accent: hsl(0, 0%, 94.1%);
+  --color-fd-accent-foreground: hsl(0, 0%, 9%);
+  --color-fd-ring: hsl(0, 0%, 63.9%);
+}
+
+.dark {
+  --color-fd-background: hsl(0, 0%, 2%);
+  --color-fd-foreground: hsl(0, 0%, 98%);
+  --color-fd-muted: hsl(0, 0%, 8%);
+  --color-fd-muted-foreground: hsl(0, 0%, 60%);
+  --color-fd-popover: hsl(0, 0%, 4%);
+  --color-fd-popover-foreground: hsl(0, 0%, 98%);
+  --color-fd-card: hsl(0, 0%, 4%);
+  --color-fd-card-foreground: hsl(0, 0%, 98%);
+  --color-fd-border: hsl(0, 0%, 50%, 0.2);
+  --color-fd-primary: hsl(0, 0%, 98%);
+  --color-fd-primary-foreground: hsl(0, 0%, 9%);
+  --color-fd-secondary: hsl(0, 0%, 12.9%);
+  --color-fd-secondary-foreground: hsl(0, 0%, 98%);
+  --color-fd-accent: hsl(0, 0%, 15%);
+  --color-fd-accent-foreground: hsl(0, 0%, 100%);
+  --color-fd-ring: hsl(0, 0%, 34.9%);
+}

package/css/catppuccin.css

@@ -0,0 +1,49 @@
+@import './lib/default-colors.css';
+
+@theme {
+  --color-fd-popover: hsl(220, 22%, 92%);
+  --color-fd-popover-foreground: hsl(234, 16%, 35%);
+  --color-fd-secondary-foreground: hsl(234, 16%, 35%);
+  --color-fd-border: hsl(223, 16%, 83%);
+  --color-fd-primary: hsl(266, 85%, 58%);
+  --color-fd-primary-foreground: hsl(220, 22%, 92%);
+  --color-fd-muted: hsl(220, 22%, 92%);
+  --color-fd-card: hsl(220, 22%, 92%);
+  --color-fd-accent: hsl(223, 16%, 83%);
+  --color-fd-accent-foreground: hsl(234, 16%, 35%);
+  --color-fd-card-foreground: hsl(234, 16%, 35%);
+  --color-fd-muted-foreground: hsl(233, 10%, 47%);
+  --color-fd-foreground: hsl(234, 16%, 35%);
+  --color-fd-secondary: hsl(220, 22%, 92%);
+  --color-fd-background: hsl(220, 23%, 95%);
+  --color-fd-ring: hsl(267, 84%, 81%);
+}
+
+.dark {
+  --color-fd-background: hsl(240, 21%, 15%);
+  --color-fd-foreground: hsl(226, 64%, 88%);
+  --color-fd-ring: hsl(267, 84%, 81%);
+  --color-fd-primary: hsl(267, 84%, 81%);
+  --color-fd-popover: hsl(240, 23%, 9%);
+  --color-fd-card: hsl(240, 21%, 12%);
+  --color-fd-muted: hsl(240, 21%, 12%);
+  --color-fd-border: hsl(237, 16%, 23%);
+  --color-fd-accent: hsl(237, 16%, 23%);
+  --color-fd-secondary: hsl(240, 21%, 12%);
+  --color-fd-primary-foreground: hsl(240, 23%, 9%);
+  --color-fd-card-foreground: hsl(226, 64%, 88%);
+  --color-fd-secondary-foreground: hsl(226, 64%, 88%);
+  --color-fd-popover-foreground: hsl(226, 64%, 88%);
+  --color-fd-accent-foreground: hsl(226, 64%, 88%);
+  --color-fd-muted-foreground: hsl(228, 24%, 72%);
+}
+
+#nd-sidebar {
+  --color-fd-secondary: hsl(223, 16%, 83%);
+  --color-fd-muted: hsl(223, 16%, 83%);
+}
+
+.dark #nd-sidebar {
+  --color-fd-secondary: hsl(237, 16%, 23%);
+  --color-fd-muted: hsl(237, 16%, 23%);
+}

package/css/dusk.css

@@ -0,0 +1,47 @@
+@import './lib/default-colors.css';
+
+@theme {
+  --color-fd-background: hsl(250, 20%, 92%);
+  --color-fd-primary: hsl(340, 40%, 48%);
+  --color-fd-border: hsl(240, 40%, 90%);
+  --color-fd-accent: hsl(250, 30%, 90%);
+  --color-fd-accent-foreground: hsl(250, 20%, 20%);
+  --color-fd-muted: hsl(240, 30%, 94%);
+  --color-fd-muted-foreground: hsl(240, 10%, 50%);
+  --color-fd-foreground: hsl(220, 20%, 30%);
+  --color-fd-secondary: hsl(250, 40%, 94%);
+  --color-fd-secondary-foreground: hsl(240, 40%, 10%);
+  --color-fd-card: hsl(250, 20%, 92%);
+  --color-fd-card-foreground: hsl(250, 20%, 20%);
+  --color-fd-popover-foreground: hsl(250, 40%, 20%);
+  --color-fd-popover: hsl(250, 40%, 96%);
+  --color-fd-primary-foreground: hsl(240, 80%, 20%);
+  --color-fd-ring: hsl(340, 40%, 48%);
+}
+
+.dark {
+  --color-fd-ring: hsl(340, 100%, 90%);
+  --color-fd-primary-foreground: hsl(240, 40%, 4%);
+  --color-fd-popover: hsl(240, 20%, 5%);
+  --color-fd-popover-foreground: hsl(250, 20%, 90%);
+  --color-fd-primary: hsl(340, 100%, 90%);
+  --color-fd-border: hsl(220, 15%, 15%);
+  --color-fd-background: hsl(220, 15%, 6%);
+  --color-fd-foreground: hsl(220, 15%, 87%);
+  --color-fd-muted: hsl(220, 20%, 15%);
+  --color-fd-muted-foreground: hsl(220, 15%, 60%);
+  --color-fd-accent: hsl(250, 20%, 15%);
+  --color-fd-secondary: hsl(240, 20%, 15%);
+  --color-fd-card-foreground: hsl(240, 15%, 87%);
+  --color-fd-card: hsl(240, 20%, 5%);
+  --color-fd-secondary-foreground: hsl(250, 20%, 90%);
+  --color-fd-accent-foreground: hsl(340, 5%, 90%);
+}
+
+#nd-sidebar {
+  background-color: hsl(250 20% 90%);
+}
+
+.dark #nd-sidebar {
+  background-color: hsl(240 20% 5%);
+}

package/css/emerald.css

@@ -0,0 +1,39 @@
+@import './lib/default-colors.css';
+
+@theme {
+  --color-fd-background: hsl(165, 45%, 96%);
+  --color-fd-foreground: hsl(165, 40%, 18%);
+  --color-fd-primary: hsl(168, 70%, 40%);
+  --color-fd-primary-foreground: hsl(168, 100%, 12%);
+  --color-fd-border: hsla(168, 40%, 70%, 0.5);
+  --color-fd-ring: hsl(168, 70%, 40%);
+  --color-fd-accent: hsl(165, 50%, 90%);
+  --color-fd-accent-foreground: hsl(168, 70%, 20%);
+  --color-fd-muted: hsl(165, 40%, 92%);
+  --color-fd-muted-foreground: hsl(165, 30%, 45%);
+  --color-fd-secondary: hsl(168, 45%, 88%);
+  --color-fd-secondary-foreground: hsl(168, 60%, 18%);
+  --color-fd-card: hsl(165, 45%, 94%);
+  --color-fd-card-foreground: hsl(165, 40%, 18%);
+  --color-fd-popover: hsl(165, 45%, 97%);
+  --color-fd-popover-foreground: hsl(165, 40%, 18%);
+}
+
+.dark {
+  --color-fd-background: hsl(200, 30%, 7%);
+  --color-fd-foreground: hsl(168, 40%, 88%);
+  --color-fd-primary: hsl(168, 70%, 60%);
+  --color-fd-primary-foreground: hsl(200, 40%, 8%);
+  --color-fd-border: hsla(168, 40%, 35%, 0.35);
+  --color-fd-ring: hsl(168, 70%, 60%);
+  --color-fd-accent: hsl(200, 30%, 18%);
+  --color-fd-accent-foreground: hsl(168, 70%, 75%);
+  --color-fd-muted: hsl(200, 30%, 12%);
+  --color-fd-muted-foreground: hsl(168, 25%, 65%);
+  --color-fd-secondary: hsl(200, 30%, 16%);
+  --color-fd-secondary-foreground: hsl(168, 40%, 88%);
+  --color-fd-card: hsl(200, 30%, 10%);
+  --color-fd-card-foreground: hsl(168, 40%, 88%);
+  --color-fd-popover: hsl(200, 30%, 8%);
+  --color-fd-popover-foreground: hsl(168, 40%, 88%);
+}

package/css/generated/docs.css

@@ -0,0 +1 @@
+@source inline("!header !showItem *:col-start-1 *:my-auto *:pointer-events-auto *:rounded-md *:row-start-1 *:w-(--fd-sidebar-width) --fd-docs-height --fd-docs-row-1 --fd-docs-row-2 --fd-docs-row-3 --fd-header-height --fd-layout-width --fd-sidebar-col --fd-sidebar-width --fd-toc-popover-height --fd-toc-width -mx-1 -translate-x-(--fd-sidebar-width) -translate-y-full [&_svg]:shrink-0 [--fd-docs-height:100dvh] [--fd-header-height:0px] [--fd-sidebar-width:0px] [--fd-toc-popover-height:0px] [--fd-toc-width:0px] [grid-area:header] [grid-area:main] [grid-area:sidebar] [grid-area:toc-popover] [grid-area:toc] after aria-valuemax aria-valuemin aria-valuenow article attribute available backdrop-blur-sm before before:absolute before:bg-fd-border before:content-[''] before:inset-s-2.5 before:inset-y-1 before:w-px bg-fd-background/80 border-b border-b-2 border-e border-e-0 border-fd-primary border-transparent border-y-0 breadcrumb breadcrumbEnabled circleProps circumference clerk click collapsing containerProps createLinkItemRenderer data-[active=true]:before:absolute data-[active=true]:before:bg-fd-primary data-[active=true]:before:content-[''] data-[active=true]:before:inset-s-2.5 data-[active=true]:before:inset-y-2.5 data-[active=true]:before:w-px data-[active=true]:bg-fd-primary/10 data-[active=true]:hover:transition-colors data-[column-changed=true]:transition-[grid-template-columns] data-[state=closed]:animate-fd-sidebar-out data-[state=open]:animate-fd-sidebar-in data-[transparent=false]:bg-fd-background/80 data-column-changed data-full data-hovered data-sidebar-collapsed data-sidebar-panel data-sidebar-placeholder data-toc-popover data-toc-popover-content data-toc-popover-trigger data-transparent defaultSlots desktop duration-250 edit empty:mb-0 first:mt-0 flex-row-reverse font-semibold footer footerEnabled footerList fumadocs-core/breadcrumb gap-2.5 gap-6 getBreadcrumbItemsFromPath grid-cols-1 gridTemplate h-(--fd-header-height) h-(--fd-toc-popover-height) h-10 h-[calc(var(--fd-docs-height)-var(--fd-docs-row-1))] hideIfDisabled hover:bg-fd-accent/50 hover:opacity-80 hover:text-fd-accent-foreground/80 hover:transition-none iconLinks including information inset-e-0 inset-s-4 inset-y-2 instant isCollapseChanged isNavTransparent isTop items-end justify-start layout-level layoutTabs linkItems max max-h-[50vh] max-md:hidden max-md:layout:[--fd-header-height:--spacing(14)] max-w-[1168px] max-w-[380px] max-w-[900px] max-xl:hidden max-xl:layout:[--fd-toc-popover-height:--spacing(10)] mb-4 mb-8 mb-auto md:layout:[--fd-sidebar-width:268px] md:pt-8 md:px-6 min min-h-(--fd-docs-height) mt-6 mx-0.5 navEnabled navTransparentMode nd-docs-layout nd-page nd-subnav nd-toc nd-toc-placeholder normalizedValue onClickItem onClickOutside overflow-x-clip p-0 pagination pb-1.5 pb-2 pe-0 pe-2.5 pe-4 pointer-events-none popover previousCollapsed progress progressbar provided pt-0.5 pt-12 pt-2 pt-3 px-6 py-0 py-6 render restSvgProps rotate-180 rounded-none rtl:-translate-x-2 rtl:translate-x-full selectedIdx setDate setPreviousCollapsed shadow-lg showItem sidebarEnabled sidebarProps size-4.5 space stroke-current/25 strokeDasharray strokeDashoffset tabMode tableOfContent tableOfContentPopover text-[1.75em] text-end text-fd-foreground timezone toc-popover toc-title tocEnabled tocPopover tocPopoverEnabled tocPopoverProps tocProps top-(--fd-docs-row-1) top-(--fd-docs-row-2) top-[calc(--spacing(4)+var(--fd-docs-row-3))] transition-[opacity,translate,color] transition-[opacity,translate] transition-[width,inset-block,translate,background-color] translate-x-2 translate-y-full transparentMode typography under unlisted updated useDocsLayout useDocsPage useFooterItems useIsScrollTop useProvider useTreeContext w-(--fd-sidebar-width) w-(--fd-toc-width) w-4 w-[85%] will xl:hidden xl:layout:[--fd-toc-width:268px] xl:pt-14 xl:px-8 z-10 z-20 z-30");

package/css/generated/flux.css

@@ -0,0 +1 @@
+@source inline("!enabled !header *:gap-0! *:rounded-lg ---spacing --removed-body-scroll-bar-size -mx-1 [&_svg]:shrink-0 [grid-area:main] after animate animate-fd-fade-in aria-valuemax aria-valuemin aria-valuenow article available backdrop-blur-md backdrop-blur-sm before before:absolute before:bg-fd-border before:content-[''] before:inset-y-1 before:start-2.5 before:w-px bg-fd-background/60 bg-fd-popover/80 border-x bottom-26 breadcrumb breadcrumbEnabled circleProps circumference clerk click containerProps createLinkItemRenderer createPortal data-[active=true]:before:absolute data-[active=true]:before:bg-fd-primary data-[active=true]:before:content-[''] data-[active=true]:before:inset-y-2.5 data-[active=true]:before:start-2.5 data-[active=true]:before:w-px data-[active=true]:bg-fd-primary/10 data-[active=true]:hover:transition-colors data-full data-toc-popover data-toc-popover-content data-toc-popover-trigger defaultChildren defaultSlots defaultTabs duration ease edit empty:mb-0 exit first:mt-0 flex-row-reverse flux-layout-slot font-semibold footer footerEnabled footerList fumadocs-core/breadcrumb gap-2.5 getBreadcrumbItemsFromPath grid-cols-1 h-8.5 h-9 head hide hideIfDisabled hover:bg-fd-accent/50 hover:opacity-80 hover:text-fd-accent-foreground/80 hover:transition-none including information initial layout-level lg:text-sm linkItems mask-[linear-gradient(to_bottom,transparent,white_--spacing(14),white_calc(100%---spacing(14)),transparent)] max max-h-[50vh] max-w-[1200px] max-w-[900px] max-w-svw mb-1.5 mb-4 mb-8 mb-auto md:pt-8 md:px-6 min min-h-11 motion motion/react ms-1 mt-6 nd-flux-layout nd-page normalizedValue onAnimationComplete overflow-x-clip overflow-y-hidden pagination pb-2 pb-24 pointer-events-none popLayout pr-(--removed-body-scroll-bar-size,0) progress progressbar provided ps-2.5 py-10 py-16 py-6 react-dom react-remove-scroll render renderNavigationPanel replace restSvgProps rotate-180 scale selectedIdx setBlockScroll setContainer setDate shadow-lg sidebarEnabled sidebarProps size-4.5 sm:border sm:bottom-6 sm:max-w-[380px] sm:max-w-[400px] sm:p-1 sm:rounded-2xl space spanProps start stroke-current/25 strokeDasharray strokeDashoffset tabDropdown tableOfContent text-[1.75em] text-end timezone tocEnabled tocProps tool transition translate-x-[calc(-50%-var(--removed-body-scroll-bar-size,0px)/2)] translateY typography under updated useDocsPage useFluxLayout useFooterItems useProvider w-[calc(100%-var(--removed-body-scroll-bar-size,0px))] wait xl:pt-14 xl:px-8 z-30");

package/css/generated/home.css

@@ -0,0 +1 @@
+@source inline("*:max-w-(--fd-layout-width) *:mx-auto --fd-layout-width -me-1.5 -ms-1.5 -mx-1 [&_svg]:size-5.5 [--fd-layout-width:1400px] are been bg-fd-background/80 border-b data-[active=true]:font-medium defaultVariants enableHoverToOpen first:ms-0 font-bold font-semibold gap-2.5 grid-cols-1 h-14 had hideIfDisabled hover:text-fd-popover-foreground/50 hovering isTop isTransparent its justify-end last:me-0 lg:grid-cols-3 lg:hidden linkItems looking max-lg:hidden max-lg:rounded-b-2xl max-lg:shadow-lg max-sm:hidden max-sm:mt-2 max-w-[240px] max-w-md mb-4 md:grid-cols-2 might mobile mt-4 navEnabled navItemVariants nd-home-layout nd-nav ps-2.5 px-6 px-8 sm:flex-row sm:hidden sm:items-center sm:justify-end temporarily text-2xl text-6xl text-base transparentMode under useHomeLayout useIsScrollTop useProvider");

package/css/generated/notebook.css

@@ -0,0 +1 @@
+@source inline("!footer !isSelected !showItem *:col-start-1 *:max-w-[1285px] *:max-w-[900px] *:my-auto *:pointer-events-auto *:row-start-1 *:w-(--fd-sidebar-width) --fd-docs-height --fd-docs-row-1 --fd-docs-row-2 --fd-docs-row-3 --fd-header-height --fd-layout-width --fd-sidebar-col --fd-sidebar-width --fd-toc-popover-height --fd-toc-width -me-1.5 -ms-1.5 -mx-1 -translate-x-(--fd-sidebar-width) -translate-y-full [&_svg]:shrink-0 [--fd-docs-height:100dvh] [--fd-header-height:0px] [--fd-sidebar-width:0px] [--fd-toc-popover-height:0px] [--fd-toc-width:0px] [grid-area:header] [grid-area:main] [grid-area:sidebar] [grid-area:toc-popover] [grid-area:toc] after aria-valuemax aria-valuemin aria-valuenow article attribute auto-cols-auto auto-rows-auto available backdrop-blur-sm before before:absolute before:bg-fd-border before:content-[''] before:inset-s-2.5 before:inset-y-1 before:w-px bg-fd-background/80 border-b border-b-2 border-e border-fd-primary border-transparent breadcrumb breadcrumbEnabled circleProps circumference clerk click collapseTrigger collapsing containerProps createLinkItemRenderer data-[active=true]:before:absolute data-[active=true]:before:bg-fd-primary data-[active=true]:before:content-[''] data-[active=true]:before:inset-s-2.5 data-[active=true]:before:inset-y-2.5 data-[active=true]:before:w-px data-[active=true]:bg-fd-primary/10 data-[active=true]:hover:transition-colors data-[collapsed=false]:hidden data-[column-changed=true]:transition-[grid-template-columns] data-[state=closed]:animate-fd-sidebar-out data-[state=open]:animate-fd-sidebar-in data-[transparent=false]:bg-fd-background/80 data-column-changed data-full data-header-body data-header-tabs data-hovered data-sidebar-collapsed data-sidebar-placeholder data-toc-popover data-toc-popover-content data-toc-popover-trigger data-transparent defaultSlots delaySetOpen desktop duration-250 edit empty:mb-0 first:mt-0 flex-row-reverse font-semibold footer footerEnabled footerList freezeUntil fumadocs-core/breadcrumb gap-2.5 gap-6 getBreadcrumbItemsFromPath grid-cols-1 gridTemplate h-(--fd-toc-popover-height) h-10 h-14 h-[calc(var(--fd-docs-height)-var(--fd-docs-row-1))] h-[calc(var(--fd-docs-height)-var(--fd-docs-row-2))] h-[calc(var(--fd-docs-height)-var(--fd-docs-row-3))] has-data-[active=true]:text-fd-primary has-data-[collapsed=true]:md:flex hideIfDisabled hover:bg-fd-accent/50 hover:opacity-80 hover:text-fd-accent-foreground/80 hover:transition-none hoverDelay iconLinks including information inset-e-0 inset-y-2 instant isCollapseChanged isLayoutTabActive isNavTransparent isSelected isTop items-end justify-end layout-level layout:[--fd-header-height:--spacing(14)] lg:hidden lg:layout:[--fd-header-height:--spacing(24)] linkItems max max-h-[50vh] max-lg:flex max-lg:hidden max-md:flex max-md:hidden max-w-[240px] max-w-[380px] max-w-sm max-xl:hidden max-xl:layout:[--fd-toc-popover-height:--spacing(10)] maxTouchPoints mb-1.5 mb-3 mb-8 mb-auto md:gap-2 md:layout:[--fd-sidebar-width:268px] md:pt-8 md:px-6 min min-h-(--fd-docs-height) mt-6 mt-px mx-0.5 navEnabled navMode navTransparentMode navbar nd-notebook-layout nd-page nd-subnav nd-toc nd-toc-placeholder normalizedValue onClickItem onClickOutside ontouchstart overflow-x-clip pageCol pagination pb-1.5 pb-2 pe-4 pointer-events-none popover previousCollapsed progress progressbar provided ps-2.5 pt-0.5 pt-12 pt-2 px-6 py-6 render resolvedTabs restSvgProps rotate-180 rtl:-translate-x-2 rtl:translate-x-full selectedIdx setDate setPreviousCollapsed shadow-lg showItem showLayoutTabs sidebarCollapsible sidebarProps size-4.5 space stroke-current/25 strokeDasharray strokeDashoffset tabMode tableOfContent tableOfContentPopover text-[1.75em] text-end text-fd-foreground timeoutRef timezone toc-popover toc-title tocEnabled tocPopover tocPopoverEnabled tocPopoverProps tocProps top-(--fd-docs-row-1) top-(--fd-docs-row-2) top-(--fd-docs-row-3) transition-[opacity,translate,color] transition-[opacity,translate] transition-[width,inset-block,translate,background-color] translate-x-2 translate-y-full transparentMode typography under unlisted updated useDocsPage useFooterItems useIsScrollTop useNotebookLayout useProvider w-(--fd-sidebar-width) w-(--fd-toc-width) w-4 w-[85%] will xl:hidden xl:layout:[--fd-toc-width:268px] xl:pt-14 xl:px-8 z-10 z-20");

package/css/generated/shared.css

@@ -0,0 +1 @@
+@source inline("!collapsed !isActive !items !nested !open !title *:flex *:flex! *:flex-col *:flex-col! *:gap-0.5! *:rounded-full --callout-color --color-fd- --color-fd-muted --fd-animated-height --fd-banner-height --offset-distance --opacity --padding-right --radix-navigation-menu-viewport-height --radix-popover-content-available-height --radix-popover-content-transform-origin --radix-popover-trigger-width --shiki-dark-bg --shiki-light-bg --spacing --track-bottom --track-top -mb-px -me-0.5 -me-2 -mx-px -rotate-90 -top-1.5 -translate-x-1/2 -translate-y-1/2 -z-1 @container @defaultValue @deprecated @fuma-translate/react @keyframes @max-lg:col-span-full @max-xl:hidden @param @radix-ui/react-accordion @radix-ui/react-collapsible @radix-ui/react-dialog @radix-ui/react-navigation-menu @radix-ui/react-popover @radix-ui/react-presence @radix-ui/react-scroll-area @radix-ui/react-tabs @ts-expect-error @typescript-eslint/no-namespace [&>figure:only-child]:-m-4 [&_svg]:size-3.5 [&_svg]:size-4 [&_svg]:size-4.5 [&_svg]:size-5 [&_svg]:size-full [&_svg]:text-fd-muted-foreground [offset-distance:var(--offset-distance,0)] [scrollbar-width:none] a abcdefghijklmnopqrstuvwxyz234567 about absolute accent accordion action actions active add advanced algoliaClient align alignItems alignmentBaseline all allowClear allowCopy allowDangerousHtml allowedMode alphabet always an anchor and animate-pulse animation another application/json area areaRef aria-describedby aria-label aria-selected as aside ask assume assumes async at auto await backdrop-blur backdrop-blur-lg backdrop-blur-xs background background-color background-position background-shift backgroundColor backgroundImage backgroundSize backward badge banner bar base baseProps baseSlots baseUrl based behaviour below bg bg-(--shiki-light-bg) bg-colored bg-div bg-fd-accent bg-fd-background bg-fd-border bg-fd-card bg-fd-muted bg-fd-muted/40 bg-fd-muted/50 bg-fd-overlay bg-fd-popover bg-fd-popover/90 bg-fd-primary bg-fd-primary/10 bg-fd-secondary bg-fd-secondary/50 bg-transparent bind binded bitsLeft black block blocks boolean border border-l border-s border-t borderBottom bottom bottom-0 bottom-1.5 boundary buffer button buttonVariants by cache cached can card case center central chain change changeLayout checked child children chooseLanguage class-variance-authority className clear client clientHeight clientWidth clip clipPath clipped clips clone close closeOnRedirect closed cn code col-span-full collapsed collapsible collection color colored colors column com comes communicated compact compat compatible component components composedRef computed concentric concern config const container containerRef content contents context contrast controlled/uncontrolled copy core corners counterSet covered createContext createMarkdownRenderer createRelativeLink css ctx current currentColor custom customize cva cx cy d dangerouslySetInnerHTML dark dark:bg-(--shiki-dark-bg) dashed data data-[active=true]:text-fd-primary data-[motion=from-end]:animate-fd-enterFromRight data-[motion=from-start]:animate-fd-enterFromLeft data-[motion=to-end]:animate-fd-exitToRight data-[motion=to-start]:animate-fd-exitToLeft data-[state=active]:bg-fd-primary data-[state=active]:text-fd-primary data-[state=closed]:animate-fd-accordion-up data-[state=closed]:animate-fd-collapsible-up data-[state=closed]:animate-fd-dialog-out data-[state=closed]:animate-fd-fade-out data-[state=closed]:animate-fd-nav-menu-out data-[state=closed]:animate-fd-popover-out data-[state=hidden]:animate-fd-fade-out data-[state=inactive]:hidden data-[state=open]:animate-fd-accordion-down data-[state=open]:animate-fd-collapsible-down data-[state=open]:animate-fd-dialog-in data-[state=open]:animate-fd-fade-in data-[state=open]:animate-fd-nav-menu-in data-[state=open]:animate-fd-popover-in data-[state=open]:bg-fd-accent data-[state=open]:bg-fd-accent/50 data-[state=open]:text-fd-accent-foreground data-accordion-value data-active data-card data-checked data-checked:text-fd-accent-foreground data-collapsed data-empty data-icon data-line-numbers data-line-numbers-start data-search data-search-full data-state data-theme-toggle date debounced declare default defaultColor defaultFormatter defaultIndex defaultItems defaultMdxComponents defaultOpen defaultOpenLevel defaultShikiFactory defaultTransform defaultUrl defaultValue defineI18nUI defined delay delegated depends deprecated depth depth-free description detect dialog dir disabled disabled:bg-fd-secondary disabled:opacity-50 disabled:pointer-events-none disabled:text-fd-secondary-foreground display displayName displayed distance div divide-y documented dominantBaseline don drawer duration-100 duration-200 duration-300 duration-400 edge-to-edge element else empty empty:hidden enabled encoded end-2 endIdx endpoint environment equal error eslint-disable-next-line event export extends external extraProps false fd-moving-banner fd-scroll-container fd-step fd-steps fetch fetchClient fetchOptions field fieldVariants figure file fill fill-(--callout-color) fill-fd-muted fill-fd-muted-foreground fill-fd-primary fill-fd-primary-foreground fills filter filters finally fixed flex flex-1 flex-col flex-row flex-wrap flexDirection focus focus-visible focus-visible:bg-fd-accent focus-visible:bg-fd-accent/30 focus-visible:bg-fd-accent/40 focus-visible:bg-fd-accent/5 focus-visible:outline-none folder folders font-medium font-mono fontSize fontWeight for forceMount forks formatter formatterOptions found fragment free from full fumadocs-core/framework fumadocs-core/highlight fumadocs-core/i18n fumadocs-core/link fumadocs-core/page-tree fumadocs-core/search fumadocs-core/source fumadocs-core/toc function gap gap-0.5 gap-1 gap-1.5 gap-2 gap-3 gap-3.5 gap-4 gap-y-4 generated get ghost github-dark github-light githubUrl global globalKey grid grid-cols-2 grid-cols-[1fr_3fr] group group-data-[state=active]:bg-fd-primary group-data-[state=open]:rotate-180 group-data-[state=open]:rotate-90 group-hover/heading:opacity-100 group/heading groupListeners guides h h-(--fd-animated-height) h-(--radix-navigation-menu-viewport-height) h-1.5 h-9.5 h-[calc(100%+--spacing(1.5))] h-full h-px h1 h2 h3 h4 h5 h6 handle handles has has-focus-visible:bg-fd-accent/50 hash hast have header headers heading height hidden hierarchy highlight highlighter hints horizontal hover hover/focus hover:bg-fd-accent hover:bg-fd-accent/80 hover:bg-fd-primary/80 hover:text-fd-accent-foreground hovered href html i i18n i18nProvider icon icon-sm icon-xs iconClass icons id idea idx if if-needed image img import in inPre inTab indentation index indicator infinite info inherits inline inline-flex inner input inputType inset-0 inset-e-2 inset-s-0 inset-s-3 inset-s-6 inset-x-0 inset-x-2 inset-y-0 inside instanceof instead integration interface intersect invisible is isActive isFirst isLast isLoading isTabActive isUp it item itemLineLengths itemVariants items items-center js just justify-between justify-center keepBackground key keydown keys l l0 l1 l2 label lang language languageSelect languages last:rounded-b-3xl layer layout leading-none leaving left-0 left-1/2 length let level light light-dark light-dark-system line line-through linear link links list list-none listener listeners locale localeTranslations locales lower ltr lucide lucide-book lucide-book-icon lucide-react main make mapped margin marginTop mark markdownUrl marked marks mask-[linear-gradient(to_bottom,transparent,white_12px,white_calc(100%-12px),transparent)] mask-[linear-gradient(to_bottom,transparent,white_16px,white_calc(100%-16px),transparent)] mask-[linear-gradient(to_bottom,white,white_30px,transparent_80px)] maskComposite maskImage max-h-(--radix-popover-content-available-height) max-h-20 max-h-[460px] max-h-[600px] max-h-[80svh] max-md:bg-fd-secondary max-md:border max-md:p-1.5 max-md:rounded-md max-w-[1400px] max-w-[98vw] max-w-full max-w-screen-sm max-width maximumFractionDigits mb-1 mb-2 md:hidden md:mb-auto md:size-5 md:top-[calc(50%-250px)] mdComponents mdRenderer mdx/types.js me-1 me-2 me-auto menu menuItems mergeRefs message middle min-h-0 min-w-0 min-w-[240px] min-w-fit min-w-full mode module mounted mouse ms-2 ms-auto ms-px mt-1 must mx-auto my-0 my-0! my-0.5 my-4 my-6 my-auto n name namespace nav navItems navTitle navigate navigation nd-copy-ignore nd-sidebar nd-sidebar-mobile nearest needed nested nested-url nesting never new next next-themes next/og no node nodes none noopener noreferrer normal normalize not not-last:mb-2 not-prose notation note now null number numbers object observer of offsetPath offsetTop on onChange onClick onCopy onKey onOpenChange onOpenChangeCallback onPointerEnter onPointerLeave onPointerMove onPrint onSearchChange onSearchChangeCallback onSelect onSelectCallback onTagChange onTagChangeCallback onValueChange only opacity opacity-(--opacity,0) opacity-0 open open/closed option optional options or oramaCloudClient orientation origin-(--radix-popover-content-transform-origin) origin-[top_center] origin-center original out outer outline outline-none output overflow-auto overflow-hidden overflow-x-auto overflow-y-auto override overscroll-contain own owner p p-0.5 p-1 p-1.5 p-2 p-3 p-4 padding paddingBottom paddingInlineStart page page-tree pageUrl parameters params parent parentId pass passed path pathname paths pb-0 pb-3 pe-2 performing persist persistent placeholder placeholder:text-fd-muted-foreground please pointerType positions powered pre prefetch present prev previous previousRef primary primaryColor primaryTextColor promise promises prop props prose prose-no-margin provide provider provides ps-1 ps-2 ps-3 ps-4 ps-8 pt-0 px px-0.5 px-1 px-1.5 px-2 px-2.5 px-3 px-4 px-px py-0.5 py-1 py-1.5 py-12 py-2 py-2.5 py-3 py-3.5 q query questions radii radius rainbow rainbowColors raw react react-hooks/rules-of-hooks react-medium-image-zoom ref referenced region rehype-raw rehypeCustomElements rehypePlugins rehypeRaw rel relative remarkRehypeOptions remove removed renderHighlights renderMarkdown replacement repo repository required resolve resolved resolvedTheme response rest result results return revalidate right-2 ring role root rootRef round rounded-2xl rounded-3xl rounded-[inherit] rounded-b-3xl rounded-full rounded-lg rounded-md rounded-sm rounded-t-3xl rounded-xl router row rows rtl:-scale-x-100 rtl:rotate-180 rtl:rotate-90 s same scroll scroll-into-view-if-needed scroll-m-20 scroll-m-24 scroll-m-28 scroll-m-4 scrollIntoView scrollMode search searchOptions searchToggle searchToggleEnabled searchTrigger secondary see select-none selected separate separated separation separator server set setActive setCollapsed setHover setLoading setMounted setOpen setOpenSearch setSvg setTag setValue shadow-md shadow-sm shift shifts shiki shikiOptions shortcuts show showAlgolia showIcons showOrama shrink-0 side sideOffset sidebar signature simple since single site size size-1 size-3 size-3.5 size-4 size-5 size-6.5 size-9 size-full sizes slots sm solid some source span specific src stars startIdx state sticky still str string stroke stroke-fd-foreground/10 stroke-fd-primary strokeLinecap strokeLinejoin strokeWidth strong style styles success supported supposed sure svg switch switcher system t tab tabIndex table tabs tabsRef tag tagName tags target text text-(--callout-color) text-[0.8125rem] text-[0.9375rem] text-center text-fd-accent-foreground text-fd-card text-fd-card-foreground text-fd-foreground/80 text-fd-muted-foreground text-fd-muted-foreground/50 text-fd-popover-foreground text-fd-popover-foreground/80 text-fd-primary text-fd-primary-foreground text-fd-primary/50 text-fd-secondary-foreground text-lg text-nowrap text-sm text-start text-xs text/plain textAnchor textContent the their theme themeAriaLabels themeSwitch themeSwitchEnabled themes this throw thumbBox tier timerRef tip title to toc tocInfo top top-0 top-1/2 top-2.5 top-3 top-4 top-flush touch transform transition-[clip-path] transition-[height] transition-[opacity,offset-distance] transition-[width,height] transition-all transition-colors transition-opacity transition-transform translationKeys translations translations/keys.json transparent tree trigger true truncate try type typeof types ui/accordion ui/accordion.tsx unchanged undefined underline underlying understand unified unist-util-visit unknown updateAnchor updates upperX url urls usage use useCopyButton useDocsSearch useI18n useId useIsDocsLayout useItems useMediaQuery useMemo useOnChange usePathname useProps useRef useRouter useSearchContext useSidebar useState useTOCItems useTheme useTranslations useTreePath useful users uses usually v v17 value valueToIdMap variables variant variants vertical via viewBox viewRef viewport viewportProps visibility visit visual void vs w w-(--radix-popover-trigger-width) w-0 w-1.5 w-1/4 w-[calc(100%-1rem)] w-fit w-full w-max w-px want warn warning when where while white whitespace-nowrap width window with wrap wrap-anywhere wrapElement wrapInSuspense wrapped x x1 x2 xmlns y y1 y2 you your z-2 z-40 z-50 zoom zoomImg zoomMargin");

package/css/lib/base.css

@@ -0,0 +1,314 @@
+:root {
+  --fd-sidebar-drawer-offset: 100%;
+}
+
+[dir='rtl'] {
+  --fd-sidebar-drawer-offset: -100%;
+}
+
+@theme {
+  --animate-fd-fade-in: fd-fade-in 300ms ease;
+  --animate-fd-fade-out: fd-fade-out 300ms ease;
+
+  --animate-fd-dialog-in: fd-dialog-in 300ms cubic-bezier(0.16, 1, 0.3, 1);
+  --animate-fd-dialog-out: fd-dialog-out 300ms cubic-bezier(0.16, 1, 0.3, 1);
+
+  --animate-fd-popover-in: fd-popover-in 100ms ease;
+  --animate-fd-popover-out: fd-popover-out 100ms ease;
+
+  --animate-fd-enterFromLeft: fd-enterFromLeft 250ms ease;
+  --animate-fd-enterFromRight: fd-enterFromRight 250ms ease;
+
+  --animate-fd-sidebar-in: fd-sidebar-in 250ms ease;
+  --animate-fd-sidebar-out: fd-sidebar-out 250ms ease;
+
+  --animate-fd-exitToLeft: fd-exitToLeft 250ms ease;
+  --animate-fd-exitToRight: fd-exitToRight 250ms ease;
+
+  --animate-fd-collapsible-down: fd-collapsible-down 150ms cubic-bezier(0.45, 0, 0.55, 1);
+  --animate-fd-collapsible-up: fd-collapsible-up 150ms cubic-bezier(0.45, 0, 0.55, 1);
+
+  --animate-fd-accordion-down: fd-accordion-down 200ms ease-out;
+  --animate-fd-accordion-up: fd-accordion-up 200ms ease-out;
+
+  --animate-fd-nav-menu-in: fd-nav-menu-in 200ms ease;
+  --animate-fd-nav-menu-out: fd-nav-menu-out 200ms ease;
+
+  @keyframes fd-sidebar-in {
+    from {
+      transform: translateX(var(--fd-sidebar-drawer-offset));
+    }
+  }
+
+  @keyframes fd-sidebar-out {
+    to {
+      transform: translateX(var(--fd-sidebar-drawer-offset));
+    }
+  }
+
+  @keyframes fd-dialog-in {
+    from {
+      transform: scale(1.06);
+      opacity: 0;
+    }
+    to {
+      transform: scale(1);
+    }
+  }
+
+  @keyframes fd-dialog-out {
+    from {
+      transform: scale(1);
+    }
+    to {
+      transform: scale(1.04);
+      opacity: 0;
+    }
+  }
+
+  @keyframes fd-popover-in {
+    from {
+      opacity: 0;
+      transform: scale(0.9);
+    }
+  }
+
+  @keyframes fd-popover-out {
+    to {
+      opacity: 0;
+      transform: scale(0.9);
+    }
+  }
+
+  @keyframes fd-fade-in {
+    from {
+      opacity: 0;
+    }
+    to {
+      opacity: 1;
+    }
+  }
+
+  @keyframes fd-fade-out {
+    from {
+      opacity: 1;
+    }
+    to {
+      opacity: 0;
+    }
+  }
+
+  @keyframes fd-enterFromRight {
+    from {
+      opacity: 0;
+      transform: translateX(200px);
+    }
+    to {
+      opacity: 1;
+      transform: translateX(0);
+    }
+  }
+
+  @keyframes fd-enterFromLeft {
+    from {
+      opacity: 0;
+      transform: translateX(-200px);
+    }
+    to {
+      opacity: 1;
+      transform: translateX(0);
+    }
+  }
+
+  @keyframes fd-exitToRight {
+    from {
+      opacity: 1;
+      transform: translateX(0);
+    }
+    to {
+      opacity: 0;
+      transform: translateX(200px);
+    }
+  }
+
+  @keyframes fd-exitToLeft {
+    from {
+      opacity: 1;
+      transform: translateX(0);
+    }
+    to {
+      opacity: 0;
+      transform: translateX(-200px);
+    }
+  }
+
+  @keyframes fd-collapsible-down {
+    from {
+      height: 0;
+      opacity: 0;
+    }
+    to {
+      height: var(--radix-collapsible-content-height);
+    }
+  }
+
+  @keyframes fd-collapsible-up {
+    from {
+      height: var(--radix-collapsible-content-height);
+    }
+    to {
+      height: 0;
+      opacity: 0;
+    }
+  }
+
+  @keyframes fd-accordion-down {
+    from {
+      height: 0;
+      opacity: 0.5;
+    }
+    to {
+      height: var(--radix-accordion-content-height);
+    }
+  }
+
+  @keyframes fd-accordion-up {
+    from {
+      height: var(--radix-accordion-content-height);
+    }
+    to {
+      height: 0;
+      opacity: 0.5;
+    }
+  }
+
+  @keyframes fd-nav-menu-in {
+    from {
+      opacity: 0;
+      height: 0px;
+    }
+    to {
+      opacity: 1;
+      height: var(--radix-navigation-menu-viewport-height);
+    }
+  }
+
+  @keyframes fd-nav-menu-out {
+    from {
+      opacity: 1;
+      height: var(--radix-navigation-menu-viewport-height);
+    }
+    to {
+      opacity: 0;
+      height: 0px;
+    }
+  }
+}
+
+@layer base {
+  *,
+  ::after,
+  ::before,
+  ::backdrop,
+  ::file-selector-button {
+    border-color: var(--color-fd-border, currentColor);
+  }
+
+  body {
+    background-color: var(--color-fd-background);
+    color: var(--color-fd-foreground);
+  }
+}
+
+@utility fd-scroll-container {
+  &::-webkit-scrollbar {
+    width: 5px;
+    height: 5px;
+  }
+
+  &::-webkit-scrollbar-thumb {
+    border-radius: 5px;
+    background: var(--color-fd-border);
+  }
+
+  &::-webkit-scrollbar-track {
+    background: transparent;
+  }
+
+  &::-webkit-scrollbar-corner {
+    display: none;
+  }
+}
+
+/*
+ * fd-steps — Law 1 fix:
+ *   Removed border-s (CSS border creates depth).
+ *   Track line is now a background-color ::after pseudo-element — color only, no depth.
+ *   Concentric: step number circle (size-8 / 32px) sits at -inset-s-4; the ::after track
+ *   is 2px wide, vertically centred between step markers — no radius calculation needed
+ *   since it is a thin decorative strip, not a nested background box.
+ */
+@utility fd-steps {
+  counter-reset: step;
+  position: relative;
+  @apply ps-6 ms-2 sm:ms-4 sm:ps-7;
+
+  &::after {
+    content: '';
+    position: absolute;
+    inset-inline-start: 0;
+    top: 1.25rem;
+    bottom: 1.25rem;
+    width: 2px;
+    border-radius: 999px;
+    background-color: var(--color-fd-border);
+  }
+}
+
+@utility fd-step {
+  &:before {
+    background-color: var(--color-fd-secondary);
+    color: var(--color-fd-secondary-foreground);
+    content: counter(step);
+    counter-increment: step;
+    justify-content: center;
+    align-items: center;
+    font-size: 0.875rem;
+    line-height: 1.25rem;
+    display: flex;
+    position: absolute;
+    @apply size-8 -inset-s-4 rounded-full;
+  }
+}
+
+@utility prose-no-margin {
+  & > :first-child {
+    margin-top: 0;
+  }
+
+  & > :last-child {
+    margin-bottom: 0;
+  }
+}
+
+@variant dark (&:where(.dark, .dark *));
+
+/* define/override layout variables */
+@variant layout {
+  #nd-docs-layout:has(&),
+  #nd-notebook-layout:has(&),
+  #nd-home-layout:has(&),
+  #nd-flux-layout:has(&) {
+    @slot;
+  }
+}
+
+@property --radix-collapsible-content-height {
+  syntax: '<length>';
+  inherits: false;
+  initial-value: 0px;
+}
+
+.fd-page-tree-item-name {
+  @apply inline-flex items-center gap-1 w-full;
+}

package/css/lib/default-colors.css

@@ -0,0 +1,51 @@
+@theme {
+  --color-fd-background: hsl(0, 0%, 96%);
+  --color-fd-foreground: hsl(0, 0%, 3.9%);
+  --color-fd-muted: hsl(0, 0%, 96.1%);
+  --color-fd-muted-foreground: hsl(0, 0%, 45.1%);
+  --color-fd-popover: hsl(0, 0%, 98%);
+  --color-fd-popover-foreground: hsl(0, 0%, 15.1%);
+  --color-fd-card: hsl(0, 0%, 94.7%);
+  --color-fd-card-foreground: hsl(0, 0%, 3.9%);
+  --color-fd-border: hsla(0, 0%, 80%, 50%);
+  --color-fd-primary: hsl(0, 0%, 9%);
+  --color-fd-primary-foreground: hsl(0, 0%, 98%);
+  --color-fd-secondary: hsl(0, 0%, 93.1%);
+  --color-fd-secondary-foreground: hsl(0, 0%, 9%);
+  --color-fd-accent: hsla(0, 0%, 82%, 50%);
+  --color-fd-accent-foreground: hsl(0, 0%, 9%);
+  --color-fd-ring: hsl(0, 0%, 63.9%);
+  --color-fd-overlay: hsla(0, 0%, 0%, 0.2);
+}
+
+.dark {
+  --color-fd-background: hsl(0, 0%, 7.04%);
+  --color-fd-foreground: hsl(0, 0%, 92%);
+  --color-fd-muted: hsl(0, 0%, 12.9%);
+  --color-fd-muted-foreground: hsla(0, 0%, 70%, 0.8);
+  --color-fd-popover: hsl(0, 0%, 11.6%);
+  --color-fd-popover-foreground: hsl(0, 0%, 86.9%);
+  --color-fd-card: hsl(0, 0%, 9.8%);
+  --color-fd-card-foreground: hsl(0, 0%, 98%);
+  --color-fd-border: hsla(0, 0%, 40%, 20%);
+  --color-fd-primary: hsl(0, 0%, 98%);
+  --color-fd-primary-foreground: hsl(0, 0%, 9%);
+  --color-fd-secondary: hsl(0, 0%, 12.9%);
+  --color-fd-secondary-foreground: hsl(0, 0%, 92%);
+  --color-fd-accent: hsla(0, 0%, 40.9%, 30%);
+  --color-fd-accent-foreground: hsl(0, 0%, 90%);
+  --color-fd-ring: hsl(0, 0%, 54.9%);
+  --color-fd-overlay: hsla(0, 0%, 0%, 0.2);
+}
+
+@theme static {
+  --color-fd-info: oklch(62.3% 0.214 259.815);
+  --color-fd-warning: oklch(76.9% 0.188 70.08);
+  --color-fd-error: oklch(63.7% 0.237 25.331);
+  --color-fd-success: oklch(72.3% 0.219 149.579);
+  --color-fd-idea: oklch(70.5% 0.209 60.849);
+  --color-fd-diff-remove: rgba(200, 10, 100, 0.12);
+  --color-fd-diff-remove-symbol: rgb(230, 10, 100);
+  --color-fd-diff-add: rgba(14, 180, 100, 0.1);
+  --color-fd-diff-add-symbol: rgb(10, 200, 100);
+}