@nadicodeai/ui 12.1.100 → 12.1.102

package/dist/components/account-menu.d.ts

@@ -1,4 +1,4 @@
-import type { ComponentProps, ReactElement, ReactNode } from "react";
+import type { ComponentProps, ReactNode } from "react";
 import type { MenuCommand } from "./action-menu.js";
 import { type MenuChoiceRowProps } from "./menu-choice-row.js";
 import type { PageCommandAction } from "./page-actions.js";
@@ -16,26 +16,29 @@ export type AccountIdentity = {
     /** The name a person recognises as theirs. */
     name: string;
     /**
-     * Under the name: an email, the scope they are working in, a notice. The
-     * trigger, one sidebar row high, shows the first; the menu's header shows
-     * them all.
+     * Under the name in the menu's header: an email, the scope they are working
+     * in. The trigger shows none of them.
      */
     lines?: ReactNode[];
+    /**
+     * A condition the person must see without opening the menu, such as the
+     * account being suspended: the trigger shows it under the name, and the
+     * menu's header shows it first.
+     */
+    notice?: ReactNode;
 };
 export type AccountMenuIdentityProps = {
     className?: string;
     identity: AccountIdentity;
     /** The picture alone, for a navigation rail drawn too narrow for the name. */
     pictureOnly?: boolean;
-    /** `lg` is the menu's own header; `default` is the trigger. */
-    size?: "default" | "lg";
 };
 /**
- * The account's avatar beside its name and lines. The trigger shows it with the
- * first line, and the menu opens on it with every line, so a person sees the
- * same block in both places.
+ * Whose account it is at the sidebar's foot, as Vercel draws it: the picture,
+ * the name with any notice under it, and the three dots at the end. The
+ * account menu's trigger draws it, and so does a sample of the Portal's column.
  */
-export declare function AccountMenuIdentity({ className, identity, pictureOnly, size, }: AccountMenuIdentityProps): import("react").JSX.Element;
+export declare function AccountMenuIdentity({ className, identity, pictureOnly, }: AccountMenuIdentityProps): import("react").JSX.Element;
 export type AccountMenuCommand = MenuCommand & {
     /** A reading at the row's end: "62% left". */
     value?: ReactNode;
@@ -43,7 +46,6 @@ export type AccountMenuCommand = MenuCommand & {
 /** A product's own exclusive setting, in a submenu: Alveare's presence. */
 export type AccountMenuChoice = {
     label: string;
-    icon: ReactElement;
     value: string;
     /** Each option's name, its mark, and one muted line under the name when the name alone does not say what it is. */
     options: readonly {
@@ -75,19 +77,17 @@ export type AccountMenuProps = {
     };
     /** Applies at once and keeps the menu open. */
     theme: ComponentProps<typeof ThemeModeMenu>;
-    language?: MenuChoiceRowProps<string> & {
-        icon: ReactElement;
-    };
+    language?: MenuChoiceRowProps<string>;
     choices?: readonly AccountMenuChoice[];
     commands?: readonly AccountMenuCommand[];
+    /** Where the product's commands stand: first, above Theme, or after its choices. */
+    commandsAt?: "end" | "start";
     signOut: AccountMenuSignOut;
     /**
      * The trigger shows the picture alone, for a navigation rail drawn too narrow
      * for the name; the menu still opens on the whole identity.
      */
     pictureOnly?: boolean;
-    /** The element the trigger renders as, when a shell has its own button. */
-    triggerRender?: ReactElement;
     align?: "center" | "end" | "start";
     side?: "bottom" | "left" | "right" | "top";
     /** Runs when the menu opens or closes, for a shell that records where it was. */
@@ -100,9 +100,9 @@ export type AccountMenuProps = {
  * @family Menus
  * @when The account at the sidebar's foot in the Portal, Nadia and Alveare: the gear to the account's settings, Theme, Language, a product's own settings, its commands, and Sign out.
  * @instead A record's or a page's commands are an ActionMenu; a setting with more than a few options or one that needs a Save belongs on a SettingsPage.
- * @behaviour The menu opens upward on the identity. In order: the gear, Theme, Language, the product's choices as submenus, its commands with any reading at their end, and Sign out last in the error colour. Theme and Language apply at once and keep the menu open. While signing out, Sign out says its pending word, the menu stays open and the trigger is locked; a failure shows under it. A Sign out that `confirms` closes the menu instead, for the product's own confirmation.
+ * @behaviour The menu opens 6 px above its trigger, 288 px wide, as Vercel's does: a header of the name and every line under it with the gear at its end, one divider, then 36 px rows, each its label leading and its icon or control trailing: Theme and Language as small round pills, the product's choices as submenus, its commands with any reading before their icon, and Sign out last. Theme and Language apply at once and keep the menu open. While signing out, Sign out says its pending word, the menu stays open and the trigger is locked; a failure shows under it. A Sign out that `confirms` closes the menu instead, for the product's own confirmation.
  * @words The menu's name ("Account"), the person's name and lines, then each row's noun or verb from the product's catalogue: "Theme", "Language", "Usage", "Sign out" and "Signing out".
  * @access The trigger and the menu are named "{label}: {name}"; the gear carries its label; the pending sign-out is aria-busy and announced through a status; a failure is an alert.
  */
-export declare function AccountMenu({ align, choices, commands, identity, label, language, onOpenChange, pictureOnly, settings, side, signOut, theme, triggerRender, }: AccountMenuProps): import("react").JSX.Element;
+export declare function AccountMenu({ align, choices, commands, commandsAt, identity, label, language, onOpenChange, pictureOnly, settings, side, signOut, theme, }: AccountMenuProps): import("react").JSX.Element;
 //# sourceMappingURL=account-menu.d.ts.map

package/dist/components/account-menu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"account-menu.d.ts","sourceRoot":"","sources":["../../src/components/account-menu.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"account-menu.d.ts","sourceRoot":"","sources":["../../src/components/account-menu.tsx"],"names":[],"mappings":"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"}

package/dist/components/account-menu.js

@@ -1,22 +1,22 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { ChevronsUpDown, LogOut, Settings, UserRound } from "lucide-react";
+import { Ellipsis, LogOut, Settings, UserRound } from "lucide-react";
 import { Avatar, AvatarFallback, AvatarImage } from "./avatar.js";
-import { DropdownMenu, DropdownMenuCommand, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, } from "./dropdown-menu.js";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, } from "./dropdown-menu.js";
 import { FieldError } from "./field.js";
 import { MenuChoiceRow } from "./menu-choice-row.js";
 import { PendingLabel } from "./pending-label.js";
 import { bodyBeyondTitle } from "./product-message.js";
 import { ThemeModeMenu } from "./theme-mode-switcher.js";
-import { MenuCommandRow, menuItemAction } from "../internal/record-menu-items.js";
+import { menuItemAction } from "../internal/record-menu-items.js";
 import { cn } from "../lib/utils.js";
 /**
- * The account's avatar beside its name and lines. The trigger shows it with the
- * first line, and the menu opens on it with every line, so a person sees the
- * same block in both places.
+ * Whose account it is at the sidebar's foot, as Vercel draws it: the picture,
+ * the name with any notice under it, and the three dots at the end. The
+ * account menu's trigger draws it, and so does a sample of the Portal's column.
  */
-export function AccountMenuIdentity({ className, identity, pictureOnly = false, size = "default", }) {
-    return (_jsxs("span", { className: cn("flex min-w-0 items-center gap-2 text-left text-sm", className), "data-slot": "account-menu-identity", children: [_jsxs(Avatar, { "aria-hidden": "true", size: size === "lg" ? "default" : "sm", children: [identity.image ? _jsx(AvatarImage, { alt: "", src: identity.image }) : null, _jsx(AvatarFallback, { children: identity.initials || _jsx(UserRound, { "aria-hidden": "true", className: "size-3/5" }) })] }), pictureOnly ? null : (_jsxs("span", { className: "grid min-w-0 flex-1 gap-0.5 leading-tight", children: [_jsx("span", { className: "truncate font-medium text-foreground", children: identity.name }), (size === "lg" ? identity.lines : identity.lines?.slice(0, 1))?.map((line, index) => (_jsx("span", { className: "truncate text-xs font-normal text-muted-foreground", children: line }, index)))] }))] }));
+export function AccountMenuIdentity({ className, identity, pictureOnly = false, }) {
+    return (_jsxs("span", { className: cn("flex min-w-0 items-center gap-2 text-left text-sm", !pictureOnly && "flex-1", className), "data-slot": "account-menu-identity", children: [_jsxs(Avatar, { "aria-hidden": "true", className: "size-5", size: "sm", children: [identity.image ? _jsx(AvatarImage, { alt: "", src: identity.image }) : null, _jsx(AvatarFallback, { children: identity.initials || _jsx(UserRound, { "aria-hidden": "true", className: "size-3/5" }) })] }), pictureOnly ? null : (_jsxs(_Fragment, { children: [_jsxs("span", { className: "grid min-w-0 flex-1 leading-tight", children: [_jsx("span", { className: "truncate text-foreground", children: identity.name }), identity.notice ? _jsx("span", { className: "truncate text-xs", children: identity.notice }) : null] }), _jsx("span", { "aria-hidden": "true", className: "grid size-6 shrink-0 place-content-center rounded-full border border-border bg-popover text-muted-foreground transition-colors group-hover/account:text-foreground group-data-[popup-open]/account:text-foreground", children: _jsx(Ellipsis, { className: "size-3" }) })] }))] }));
 }
 /**
  * The account menu at the foot of a shell's navigation: whose account it is,
@@ -25,20 +25,24 @@ export function AccountMenuIdentity({ className, identity, pictureOnly = false,
  * @family Menus
  * @when The account at the sidebar's foot in the Portal, Nadia and Alveare: the gear to the account's settings, Theme, Language, a product's own settings, its commands, and Sign out.
  * @instead A record's or a page's commands are an ActionMenu; a setting with more than a few options or one that needs a Save belongs on a SettingsPage.
- * @behaviour The menu opens upward on the identity. In order: the gear, Theme, Language, the product's choices as submenus, its commands with any reading at their end, and Sign out last in the error colour. Theme and Language apply at once and keep the menu open. While signing out, Sign out says its pending word, the menu stays open and the trigger is locked; a failure shows under it. A Sign out that `confirms` closes the menu instead, for the product's own confirmation.
+ * @behaviour The menu opens 6 px above its trigger, 288 px wide, as Vercel's does: a header of the name and every line under it with the gear at its end, one divider, then 36 px rows, each its label leading and its icon or control trailing: Theme and Language as small round pills, the product's choices as submenus, its commands with any reading before their icon, and Sign out last. Theme and Language apply at once and keep the menu open. While signing out, Sign out says its pending word, the menu stays open and the trigger is locked; a failure shows under it. A Sign out that `confirms` closes the menu instead, for the product's own confirmation.
  * @words The menu's name ("Account"), the person's name and lines, then each row's noun or verb from the product's catalogue: "Theme", "Language", "Usage", "Sign out" and "Signing out".
  * @access The trigger and the menu are named "{label}: {name}"; the gear carries its label; the pending sign-out is aria-busy and announced through a status; a failure is an alert.
  */
-export function AccountMenu({ align = "start", choices = [], commands = [], identity, label, language, onOpenChange, pictureOnly = false, settings, side = "top", signOut, theme, triggerRender, }) {
+export function AccountMenu({ align = "start", choices = [], commands = [], commandsAt = "end", identity, label, language, onOpenChange, pictureOnly = false, settings, side = "top", signOut, theme, }) {
     const name = `${label}: ${identity.name}`;
-    return (_jsxs(DropdownMenu, { onOpenChange: onOpenChange, children: [_jsxs(DropdownMenuTrigger, { "aria-label": name, disabled: signOut.pending, render: triggerRender ?? (_jsx("button", { className: "flex w-full min-w-0 items-center gap-2 rounded-sm p-1.5 text-left outline-none hover:bg-accent focus-visible:nc-focus-outline focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50 data-[popup-open]:bg-accent", type: "button" })), children: [_jsx(AccountMenuIdentity, { className: pictureOnly ? undefined : "flex-1", identity: identity, pictureOnly: pictureOnly }), pictureOnly ? null : (_jsx(ChevronsUpDown, { "aria-hidden": "true", className: "ml-auto size-4 shrink-0 text-muted-foreground" }))] }), _jsxs(DropdownMenuContent, { align: align, "aria-label": name, className: "w-72 max-w-[calc(100vw-2rem)]", density: "comfortable", side: side, sideOffset: 8, children: [_jsxs(DropdownMenuGroup, { className: "flex min-w-0 items-center gap-1 pr-1.5", children: [_jsx(AccountMenuIdentity, { className: "min-w-0 flex-1 px-2 py-2", identity: identity, size: "lg" }), settings ? (_jsx(DropdownMenuItem, { "aria-label": settings.label, iconOnly: true, ...menuItemAction(settings), children: _jsx(Settings, { "aria-hidden": "true" }) })) : null] }), _jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuGroup, { children: [_jsx(ThemeModeMenu, { ...theme }), language ? _jsx(MenuChoiceRow, { ...language }) : null, choices.map((choice) => (_jsx(AccountMenuChoiceRow, { choice: choice }, choice.label)))] }), commands.length > 0 ? (_jsxs(_Fragment, { children: [_jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuGroup, { children: commands.map(({ value, ...command }) => (_jsx(MenuCommandRow, { command: command, value: value }, command.label))) })] })) : null, _jsx(DropdownMenuSeparator, {}), _jsxs(DropdownMenuGroup, { children: [_jsx(DropdownMenuCommand, { "aria-busy": signOut.pending || undefined, closeOnClick: signOut.confirms === true, disabled: signOut.pending, icon: _jsx(LogOut, {}), onClick: () => {
+    const commandRows = commands.map(({ value, ...command }) => (_jsx(AccountMenuRow, { "aria-label": command.accessibleName, disabled: command.disabled, icon: command.icon, reason: command.reason, value: value, ...menuItemAction(command), children: command.label }, command.label)));
+    return (_jsxs(DropdownMenu, { onOpenChange: onOpenChange, children: [_jsx(DropdownMenuTrigger, { "aria-label": name, className: cn("group/account flex min-h-9 min-w-0 items-center rounded-full outline-none focus-visible:nc-focus-outline focus-visible:outline-ring disabled:pointer-events-none disabled:opacity-50", pictureOnly ? "justify-center" : "w-full pr-2 pl-2.5"), disabled: signOut.pending, children: _jsx(AccountMenuIdentity, { identity: identity, pictureOnly: pictureOnly }) }), _jsxs(DropdownMenuContent, { align: align, "aria-label": name, className: "w-72 max-w-[calc(100vw-2rem)] p-1.5", density: "comfortable", side: side, sideOffset: 6, children: [_jsxs(DropdownMenuGroup, { className: "flex min-w-0 items-center gap-2 py-1.5 pl-2", "data-slot": "account-menu-header", children: [_jsxs("span", { className: "grid min-w-0 flex-1 gap-0.5 text-left", children: [_jsx("span", { className: "truncate text-sm font-medium text-foreground", children: identity.name }), identity.notice ? _jsx("span", { className: "text-xs", children: identity.notice }) : null, identity.lines?.map((line, index) => (_jsx("span", { className: "truncate text-xs text-muted-foreground", children: line }, index)))] }), settings ? (_jsx(DropdownMenuItem, { "aria-label": settings.label, className: "text-muted-foreground", iconOnly: true, ...menuItemAction(settings), children: _jsx(Settings, { "aria-hidden": "true" }) })) : null] }), _jsx(DropdownMenuSeparator, { className: "-mx-1.5 my-1.5" }), _jsxs(DropdownMenuGroup, { children: [commandsAt === "start" ? commandRows : null, _jsx(ThemeModeMenu, { ...theme }), language ? _jsx(MenuChoiceRow, { ...language }) : null, choices.map((choice) => (_jsx(AccountMenuChoiceRow, { choice: choice }, choice.label))), commandsAt === "end" ? commandRows : null, _jsx(AccountMenuRow, { "aria-busy": signOut.pending || undefined, closeOnClick: signOut.confirms === true, disabled: signOut.pending, icon: _jsx(LogOut, {}), onClick: () => {
                                     if (!signOut.pending)
                                         signOut.onSignOut();
-                                }, variant: "destructive", children: _jsx(PendingLabel, { pending: signOut.pending, pendingLabel: signOut.pendingLabel, children: signOut.label }) }), signOut.pending ? (_jsx("span", { className: "sr-only", role: "status", children: signOut.pendingLabel })) : null, signOut.failure ? (_jsxs(FieldError, { className: "mx-3 mb-1 break-words", "data-message-code": signOut.failure.code, children: [_jsx("span", { className: "block font-medium", children: signOut.failure.title }), bodyBeyondTitle(signOut.failure) ? (_jsx("span", { className: "block", children: bodyBeyondTitle(signOut.failure) })) : null] })) : null] })] })] }));
+                                }, children: _jsx(PendingLabel, { pending: signOut.pending, pendingLabel: signOut.pendingLabel, children: signOut.label }) }), signOut.pending ? (_jsx("span", { className: "sr-only", role: "status", children: signOut.pendingLabel })) : null, signOut.failure ? (_jsxs(FieldError, { className: "mx-2 mb-1 break-words", "data-message-code": signOut.failure.code, children: [_jsx("span", { className: "block font-medium", children: signOut.failure.title }), bodyBeyondTitle(signOut.failure) ? (_jsx("span", { className: "block", children: bodyBeyondTitle(signOut.failure) })) : null] })) : null] })] })] }));
+}
+function AccountMenuRow({ children, icon, reason, value, ...props }) {
+    return (_jsxs(DropdownMenuItem, { ...props, className: "min-h-9 gap-3 px-2 py-1.5 group-data-[density=comfortable]/menu:px-2 group-data-[density=comfortable]/menu:py-1.5 [@media(hover:hover)_and_(pointer:fine)]:min-h-9", children: [_jsxs("span", { className: "grid min-w-0 flex-1 gap-0.5", children: [_jsx("span", { className: "truncate", children: children }), reason ? _jsx("span", { className: "text-xs text-muted-foreground", children: reason }) : null] }), value === undefined ? null : " ", value === undefined ? null : (_jsx(DropdownMenuShortcut, { className: "ml-0", children: value })), _jsx("span", { "aria-hidden": "true", className: "flex shrink-0 items-center text-muted-foreground", children: icon })] }));
 }
 function AccountMenuChoiceRow({ choice }) {
     const current = choice.options.find((option) => option.value === choice.value);
-    return (_jsxs(DropdownMenuSub, { children: [_jsxs(DropdownMenuSubTrigger, { className: "gap-2.5", children: [_jsx("span", { "aria-hidden": "true", className: "flex shrink-0 items-center text-muted-foreground", children: choice.icon }), _jsx("span", { className: "min-w-0 flex-1 truncate", children: choice.label }), current ? (_jsx(DropdownMenuShortcut, { className: "ml-0", children: current.label })) : null] }), _jsx(DropdownMenuSubContent, { children: _jsx(DropdownMenuRadioGroup, { "aria-label": choice.label, onValueChange: (next) => {
+    return (_jsxs(DropdownMenuSub, { children: [_jsxs(DropdownMenuSubTrigger, { className: "min-h-9 gap-3 px-2 py-1.5 group-data-[density=comfortable]/menu:px-2 group-data-[density=comfortable]/menu:py-1.5 [@media(hover:hover)_and_(pointer:fine)]:min-h-9", children: [_jsx("span", { className: "min-w-0 flex-1 truncate", children: choice.label }), current ? (_jsx(DropdownMenuShortcut, { className: "ml-0", children: current.label })) : null] }), _jsx(DropdownMenuSubContent, { children: _jsx(DropdownMenuRadioGroup, { "aria-label": choice.label, onValueChange: (next) => {
                         const selected = choice.options.find((option) => option.value === next);
                         if (selected)
                             choice.onValueChange(selected.value);

package/dist/components/menu-choice-row.d.ts

@@ -8,25 +8,23 @@ export type MenuChoiceOption<Value extends string = string> = {
 };
 export type MenuChoiceRowProps<Value extends string = string> = Omit<React.ComponentProps<"div">, "children" | "onChange"> & {
     label: string;
-    /** Leads the label, so the row starts on the commands' line: the current theme's glyph. */
-    icon?: React.ReactElement | undefined;
     options: readonly MenuChoiceOption<Value>[];
     onValueChange: (value: Value) => void;
     value: Value;
     disabled?: boolean;
 };
 /**
- * A named preference inside a menu: its icon and label at the leading edge, the
- * exclusive choices together at the trailing edge, close enough to read as one
- * control.
+ * A named preference inside a menu: its label at the leading edge and the
+ * exclusive choices in one small round pill at the trailing edge, as Vercel's
+ * account menu draws Theme.
  *
  * @family Menus
  * @when A setting that applies at once from inside a menu: the account menu's Theme and Language.
  * @instead A product's own setting with more choices or longer names is a submenu of radio items (`AccountMenu`'s `choices`). A setting on a page is a `ToggleGroup` or a `Select` in its section.
- * @behaviour Icon and label lead, on the commands' 12 px line; the choices sit in one bordered group at the trailing edge. Choosing applies at once and keeps the menu open, so the result shows without reopening it.
+ * @behaviour The label leads on the row's 36 px line; the choices sit in one round pill at the trailing edge, the chosen one ringed. Choosing applies at once and keeps the menu open, so the result shows without reopening it.
  * @words The label is a noun: "Theme", "Language". Each choice carries a full name even when it shows a glyph or a short code: "EN" is named "English".
- * @access A radio group named by the label; each choice is a radio named by its `label`, with the same text as its tooltip. The icon is hidden.
+ * @access A radio group named by the label; each choice is a radio named by its `label`, with the same text as its tooltip.
  */
-declare function MenuChoiceRow<Value extends string = string>({ className, disabled, icon, label, onValueChange, options, value, ...props }: MenuChoiceRowProps<Value>): React.JSX.Element;
+declare function MenuChoiceRow<Value extends string = string>({ className, disabled, label, onValueChange, options, value, ...props }: MenuChoiceRowProps<Value>): React.JSX.Element;
 export { MenuChoiceRow };
 //# sourceMappingURL=menu-choice-row.d.ts.map

package/dist/components/menu-choice-row.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menu-choice-row.d.ts","sourceRoot":"","sources":["../../src/components/menu-choice-row.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,MAAM,MAAM,gBAAgB,CAAC,KAAK,SAAS,MAAM,GAAG,MAAM,IAAI;IAC5D,sDAAsD;IACtD,KAAK,EAAE,MAAM,CAAC;IACd,wDAAwD;IACxD,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,KAAK,EAAE,KAAK,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,kBAAkB,CAAC,KAAK,SAAS,MAAM,GAAG,MAAM,IAAI,IAAI,CAClE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAC3B,UAAU,GAAG,UAAU,CACxB,GAAG;IACF,KAAK,EAAE,MAAM,CAAC;IACd,2FAA2F;IAC3F,IAAI,CAAC,EAAE,KAAK,CAAC,YAAY,GAAG,SAAS,CAAC;IACtC,OAAO,EAAE,SAAS,gBAAgB,CAAC,KAAK,CAAC,EAAE,CAAC;IAC5C,aAAa,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACtC,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF;;;;;;;;;;;GAWG;AACH,iBAAS,aAAa,CAAC,KAAK,SAAS,MAAM,GAAG,MAAM,EAAE,EACpD,SAAS,EACT,QAAQ,EACR,IAAI,EACJ,KAAK,EACL,aAAa,EACb,OAAO,EACP,KAAK,EACL,GAAG,KAAK,EACT,EAAE,kBAAkB,CAAC,KAAK,CAAC,qBA8C3B;AAED,OAAO,EAAE,aAAa,EAAE,CAAC"}
+{"version":3,"file":"menu-choice-row.d.ts","sourceRoot":"","sources":["../../src/components/menu-choice-row.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,MAAM,MAAM,gBAAgB,CAAC,KAAK,SAAS,MAAM,GAAG,MAAM,IAAI;IAC5D,sDAAsD;IACtD,KAAK,EAAE,MAAM,CAAC;IACd,wDAAwD;IACxD,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,KAAK,EAAE,KAAK,CAAC;CACd,CAAC;AAEF,MAAM,MAAM,kBAAkB,CAAC,KAAK,SAAS,MAAM,GAAG,MAAM,IAAI,IAAI,CAClE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAC3B,UAAU,GAAG,UAAU,CACxB,GAAG;IACF,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,SAAS,gBAAgB,CAAC,KAAK,CAAC,EAAE,CAAC;IAC5C,aAAa,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IACtC,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF;;;;;;;;;;;GAWG;AACH,iBAAS,aAAa,CAAC,KAAK,SAAS,MAAM,GAAG,MAAM,EAAE,EACpD,SAAS,EACT,QAAQ,EACR,KAAK,EACL,aAAa,EACb,OAAO,EACP,KAAK,EACL,GAAG,KAAK,EACT,EAAE,kBAAkB,CAAC,KAAK,CAAC,qBAkC3B;AAED,OAAO,EAAE,aAAa,EAAE,CAAC"}

package/dist/components/menu-choice-row.js

@@ -2,22 +2,22 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { DropdownMenuRadioGroup, DropdownMenuRadioItem } from "./dropdown-menu.js";
 import { cn } from "../lib/utils.js";
 /**
- * A named preference inside a menu: its icon and label at the leading edge, the
- * exclusive choices together at the trailing edge, close enough to read as one
- * control.
+ * A named preference inside a menu: its label at the leading edge and the
+ * exclusive choices in one small round pill at the trailing edge, as Vercel's
+ * account menu draws Theme.
  *
  * @family Menus
  * @when A setting that applies at once from inside a menu: the account menu's Theme and Language.
  * @instead A product's own setting with more choices or longer names is a submenu of radio items (`AccountMenu`'s `choices`). A setting on a page is a `ToggleGroup` or a `Select` in its section.
- * @behaviour Icon and label lead, on the commands' 12 px line; the choices sit in one bordered group at the trailing edge. Choosing applies at once and keeps the menu open, so the result shows without reopening it.
+ * @behaviour The label leads on the row's 36 px line; the choices sit in one round pill at the trailing edge, the chosen one ringed. Choosing applies at once and keeps the menu open, so the result shows without reopening it.
  * @words The label is a noun: "Theme", "Language". Each choice carries a full name even when it shows a glyph or a short code: "EN" is named "English".
- * @access A radio group named by the label; each choice is a radio named by its `label`, with the same text as its tooltip. The icon is hidden.
+ * @access A radio group named by the label; each choice is a radio named by its `label`, with the same text as its tooltip.
  */
-function MenuChoiceRow({ className, disabled, icon, label, onValueChange, options, value, ...props }) {
-    return (_jsxs("div", { "data-slot": "menu-choice-row", className: cn("flex min-h-touch-target items-center justify-between gap-4 px-3 py-1 text-sm", className), ...props, children: [_jsxs("span", { className: "flex min-w-0 items-center gap-2.5", children: [icon ? (_jsx("span", { "aria-hidden": "true", className: "flex h-5 shrink-0 items-center justify-center text-muted-foreground [&_svg:not([class*='size-'])]:size-4", children: icon })) : null, _jsx("span", { children: label })] }), _jsx(DropdownMenuRadioGroup, { "aria-label": label, className: "flex shrink-0 items-center gap-0.5 rounded-md border border-border p-0.5", value: value, onValueChange: (next) => {
+function MenuChoiceRow({ className, disabled, label, onValueChange, options, value, ...props }) {
+    return (_jsxs("div", { "data-slot": "menu-choice-row", className: cn("flex h-9 items-center justify-between gap-3 px-2 text-sm", className), ...props, children: [_jsx("span", { className: "min-w-0 truncate", children: label }), _jsx(DropdownMenuRadioGroup, { "aria-label": label, className: "flex shrink-0 items-center rounded-full border border-border", value: value, onValueChange: (next) => {
                     const selected = options.find((option) => option.value === next);
                     if (selected)
                         onValueChange(selected.value);
-                }, children: options.map((option) => (_jsx(DropdownMenuRadioItem, { value: option.value, "aria-label": option.label, title: option.label, iconOnly: true, closeOnClick: false, disabled: disabled, children: option.content }, option.value))) })] }));
+                }, children: options.map((option) => (_jsx(DropdownMenuRadioItem, { value: option.value, "aria-label": option.label, title: option.label, iconOnly: true, className: "size-6 rounded-full text-xs text-muted-foreground data-checked:bg-popover data-checked:text-foreground data-checked:ring-1 data-checked:ring-border", closeOnClick: false, disabled: disabled, children: option.content }, option.value))) })] }));
 }
 export { MenuChoiceRow };

package/dist/components/portal-sidebar-frame.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"portal-sidebar-frame.d.ts","sourceRoot":"","sources":["../../src/components/portal-sidebar-frame.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,EAAuB,KAAK,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAkBtF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,oEAAoE;IACpE,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,sEAAsE;IACtE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,iBAAiB,EAAE,CAAC;CAC5B,CAAC;AAiBF;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,OAAO,EACP,KAAK,EACL,SAAS,EACT,SAAS,EACT,UAAU,EACV,QAAQ,EACR,WAAW,GACZ,EAAE;IACD,OAAO,EAAE,eAAe,CAAC;IACzB,KAAK,EAAE,iBAAiB,EAAE,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,8CAA8C;IAC9C,SAAS,EAAE,MAAM,CAAC;IAClB,qFAAqF;IACrF,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAC/B,oEAAoE;IACpE,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;CACrB,+BAwEA"}
+{"version":3,"file":"portal-sidebar-frame.d.ts","sourceRoot":"","sources":["../../src/components/portal-sidebar-frame.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAGvC,OAAO,EAAuB,KAAK,eAAe,EAAE,MAAM,2BAA2B,CAAC;AAkBtF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,oEAAoE;IACpE,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,iBAAiB,GAAG;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,sEAAsE;IACtE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,iBAAiB,EAAE,CAAC;CAC5B,CAAC;AAiBF;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,wBAAgB,kBAAkB,CAAC,EACjC,OAAO,EACP,KAAK,EACL,SAAS,EACT,SAAS,EACT,UAAU,EACV,QAAQ,EACR,WAAW,GACZ,EAAE;IACD,OAAO,EAAE,eAAe,CAAC;IACzB,KAAK,EAAE,iBAAiB,EAAE,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,8CAA8C;IAC9C,SAAS,EAAE,MAAM,CAAC;IAClB,qFAAqF;IACrF,UAAU,CAAC,EAAE,iBAAiB,CAAC;IAC/B,oEAAoE;IACpE,QAAQ,EAAE,MAAM,CAAC;IACjB,WAAW,EAAE,MAAM,CAAC;CACrB,+BAkEA"}

package/dist/components/portal-sidebar-frame.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ChevronsUpDown, Search } from "lucide-react";
+import { Search } from "lucide-react";
 import { AccountMenuIdentity } from "./account-menu.js";
 import { BrandWordmark } from "./brand.js";
 import { Kbd, KbdGroup } from "./kbd.js";
@@ -36,5 +36,5 @@ function ItemRow({ item, variant }) {
  * `role="img"` named nadicode.
  */
 export function PortalSidebarFrame({ account, bands, className, findLabel, footerItem, subtitle, toggleLabel, }) {
-    return (_jsx(Sidebar, { collapsible: "none", className: cn("h-auto shrink-0", className), children: _jsxs("div", { className: "grid min-h-0 flex-1 grid-rows-[auto_minmax(0,1fr)_auto_auto] bg-border *:min-w-0", children: [_jsxs("div", { className: "grid grid-rows-[3.5rem_auto] gap-px bg-border *:bg-sidebar", children: [_jsxs(SidebarHeader, { className: "h-full flex-row items-center justify-between gap-1 px-3 py-0", children: [_jsxs("div", { className: "grid min-w-0 flex-1 gap-0", children: [_jsx(BrandWordmark, { alt: "", className: "h-5 w-28 max-w-full" }), _jsx("span", { className: "truncate text-xs text-muted-foreground", children: subtitle })] }), _jsx(SidebarTrigger, { "aria-label": toggleLabel, className: "shrink-0" })] }), _jsx("div", { className: "p-2", children: _jsx(SidebarMenu, { children: _jsx(SidebarMenuItem, { children: _jsxs(SidebarMenuButton, { variant: "outline", children: [_jsx(Search, { "aria-hidden": "true", className: "text-muted-foreground" }), _jsx("span", { className: "min-w-0 flex-1 truncate text-left text-muted-foreground", children: findLabel }), _jsxs(KbdGroup, { className: "ml-auto", children: [_jsx(Kbd, { children: "\u2318" }), _jsx(Kbd, { children: "K" })] })] }) }) }) })] }), _jsx(SidebarContent, { className: "bg-sidebar", children: bands.map((band) => (_jsxs(SidebarGroup, { children: [band.label ? (_jsx(SidebarGroupLabel, { render: _jsx("h2", {}), children: band.label })) : null, _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: band.items.map((item) => (_jsx(ItemRow, { item: item }, item.id))) }) })] }, band.id))) }), footerItem ? (_jsx(SidebarGroup, { className: "border-t bg-sidebar", children: _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: _jsx(ItemRow, { item: footerItem, variant: "outline" }) }) }) })) : null, _jsx(SidebarFooter, { className: "border-t bg-sidebar", children: _jsx(SidebarMenu, { children: _jsx(SidebarMenuItem, { children: _jsxs(SidebarMenuButton, { size: "lg", children: [_jsx(AccountMenuIdentity, { className: "flex-1", identity: account }), _jsx(ChevronsUpDown, { "aria-hidden": "true", className: "ml-auto size-4 text-muted-foreground" })] }) }) }) })] }) }));
+    return (_jsx(Sidebar, { collapsible: "none", className: cn("h-auto shrink-0", className), children: _jsxs("div", { className: "grid min-h-0 flex-1 grid-rows-[auto_minmax(0,1fr)_auto_auto] bg-border *:min-w-0", children: [_jsxs("div", { className: "grid grid-rows-[3.5rem_auto] gap-px bg-border *:bg-sidebar", children: [_jsxs(SidebarHeader, { className: "h-full flex-row items-center justify-between gap-1 px-3 py-0", children: [_jsxs("div", { className: "grid min-w-0 flex-1 gap-0", children: [_jsx(BrandWordmark, { alt: "", className: "h-5 w-28 max-w-full" }), _jsx("span", { className: "truncate text-xs text-muted-foreground", children: subtitle })] }), _jsx(SidebarTrigger, { "aria-label": toggleLabel, className: "shrink-0" })] }), _jsx("div", { className: "p-2", children: _jsx(SidebarMenu, { children: _jsx(SidebarMenuItem, { children: _jsxs(SidebarMenuButton, { variant: "outline", children: [_jsx(Search, { "aria-hidden": "true", className: "text-muted-foreground" }), _jsx("span", { className: "min-w-0 flex-1 truncate text-left text-muted-foreground", children: findLabel }), _jsxs(KbdGroup, { className: "ml-auto", children: [_jsx(Kbd, { children: "\u2318" }), _jsx(Kbd, { children: "K" })] })] }) }) }) })] }), _jsx(SidebarContent, { className: "bg-sidebar", children: bands.map((band) => (_jsxs(SidebarGroup, { children: [band.label ? (_jsx(SidebarGroupLabel, { render: _jsx("h2", {}), children: band.label })) : null, _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: band.items.map((item) => (_jsx(ItemRow, { item: item }, item.id))) }) })] }, band.id))) }), footerItem ? (_jsx(SidebarGroup, { className: "border-t bg-sidebar", children: _jsx(SidebarGroupContent, { children: _jsx(SidebarMenu, { children: _jsx(ItemRow, { item: footerItem, variant: "outline" }) }) }) })) : null, _jsx(SidebarFooter, { className: "border-t bg-sidebar", children: _jsx(SidebarMenu, { children: _jsx(SidebarMenuItem, { className: "group/account flex min-h-9 items-center pr-2 pl-2.5", children: _jsx(AccountMenuIdentity, { identity: account }) }) }) })] }) }));
 }

package/dist/components/settings-page.d.ts

@@ -11,8 +11,8 @@ export type SettingsPageProps = {
  *
  * @family Compositions
  * @when A place whose job is changing how something behaves: an account's profile, a company's identity, Nadia's notifications.
- * @instead One object's page with a settings card among its sections is an ObjectPage; Theme and Language, which apply on change, stay in the account menu.
- * @behaviour The sections stack 20 apart in a centred column at most 56rem wide. The page draws no header and no save of its own: each SettingsSection saves from its footer.
+ * @instead One object's page with a settings card among its sections is an ObjectPage.
+ * @behaviour The sections stack 20 apart in a centred column at most 56rem wide. The page draws no header and no save of its own: a choice applies at once, and each SettingsSection of typed values saves from its footer.
  * @words `title` names the place as the navigation does ("Profile"); the sections' titles and lines carry the rest.
  * @access `title` becomes a visually hidden h1 for a product whose chrome shows the place without a heading; leave it out where the chrome already draws the h1.
  */

package/dist/components/settings-page.js

@@ -6,8 +6,8 @@ import { ReadingColumn } from "./reading-column.js";
  *
  * @family Compositions
  * @when A place whose job is changing how something behaves: an account's profile, a company's identity, Nadia's notifications.
- * @instead One object's page with a settings card among its sections is an ObjectPage; Theme and Language, which apply on change, stay in the account menu.
- * @behaviour The sections stack 20 apart in a centred column at most 56rem wide. The page draws no header and no save of its own: each SettingsSection saves from its footer.
+ * @instead One object's page with a settings card among its sections is an ObjectPage.
+ * @behaviour The sections stack 20 apart in a centred column at most 56rem wide. The page draws no header and no save of its own: a choice applies at once, and each SettingsSection of typed values saves from its footer.
  * @words `title` names the place as the navigation does ("Profile"); the sections' titles and lines carry the rest.
  * @access `title` becomes a visually hidden h1 for a product whose chrome shows the place without a heading; leave it out where the chrome already draws the h1.
  */

package/dist/components/settings-section.d.ts

@@ -31,11 +31,11 @@ export type SettingsSectionProps = Omit<React.ComponentProps<"section">, "title"
  * A card of related settings that says what changing them does and saves them from its own footer.
  *
  * @family Compositions
- * @when A few related values a person changes and saves together, on a SettingsPage or as a section of an ObjectPage: Personal details, Company identity, Notifications.
- * @instead Read-only values are a SettingsFactsSection; Theme and Language, which apply on change, live in the account menu; a record's edit in a list is a RowEditForm.
- * @behaviour With `save`: Save stays disabled until a field differs from what is saved, says `pendingLabel` while saving with Cancel held beside it, then the footer shows the ok check and `savedLabel` until the next change. A failure keeps every value and shows under its field until that field changes, or above the footer until the next save. A `cancel` that runs work of its own says its `pendingLabel` while `pending`. Without `save`, the footer holds `footerHint` and `footer`, and is left out when both are.
- * @words The title names the values ("Personal details"); the description says what changing them does, in one line; the hint says where the save applies ("Saved for every device you sign in on."); Save, Saving and Saved come from the product's catalogue.
- * @access The title is the section's h2 and names the form that saves it. The footer's hint and saved line are one status, announced politely; a failure under a field marks the control invalid and describes it.
+ * @when A few related settings on a SettingsPage or as a section of an ObjectPage: choices that apply at once, without `save` (Notifications), or typed values a person saves together, with `save` (Personal details, Company identity).
+ * @instead Read-only values are a SettingsFactsSection; a collection is a CollectionPage; a record's edit in a list is a RowEditForm.
+ * @behaviour With `save`: Save stays disabled until a field differs from what is saved, says `pendingLabel` while saving with Cancel held beside it, then calls `saved`, which the product answers with its own toast; the footer never shows a saved state. A failure keeps every value and shows under its field until that field changes, or above the footer until the next save. A `cancel` that runs work of its own says its `pendingLabel` while `pending`. Without `save`, the footer holds `footerHint` and `footer`, and is left out when both are.
+ * @words The title names the values ("Personal details"); the description says what changing them does, in one line; the hint is optional and says what is specific to this card: a limit ("Please use 32 characters at maximum."), what a value is for, the plan a feature needs, or a "Learn more" link, never one sentence every card repeats; Save and Saving come from the product's catalogue, and the saved toast from its notices.
+ * @access The title is the section's h2 and names the form that saves it. The saved toast is announced by the product's toast region; a failure under a field marks the control invalid and describes it.
  */
 declare function SettingsSection({ title, description, actions, columns, children, className, save, footer, footerHint, ...props }: SettingsSectionProps): React.JSX.Element;
 /**

package/dist/components/settings-section.js

@@ -9,11 +9,11 @@ import { Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLab
  * A card of related settings that says what changing them does and saves them from its own footer.
  *
  * @family Compositions
- * @when A few related values a person changes and saves together, on a SettingsPage or as a section of an ObjectPage: Personal details, Company identity, Notifications.
- * @instead Read-only values are a SettingsFactsSection; Theme and Language, which apply on change, live in the account menu; a record's edit in a list is a RowEditForm.
- * @behaviour With `save`: Save stays disabled until a field differs from what is saved, says `pendingLabel` while saving with Cancel held beside it, then the footer shows the ok check and `savedLabel` until the next change. A failure keeps every value and shows under its field until that field changes, or above the footer until the next save. A `cancel` that runs work of its own says its `pendingLabel` while `pending`. Without `save`, the footer holds `footerHint` and `footer`, and is left out when both are.
- * @words The title names the values ("Personal details"); the description says what changing them does, in one line; the hint says where the save applies ("Saved for every device you sign in on."); Save, Saving and Saved come from the product's catalogue.
- * @access The title is the section's h2 and names the form that saves it. The footer's hint and saved line are one status, announced politely; a failure under a field marks the control invalid and describes it.
+ * @when A few related settings on a SettingsPage or as a section of an ObjectPage: choices that apply at once, without `save` (Notifications), or typed values a person saves together, with `save` (Personal details, Company identity).
+ * @instead Read-only values are a SettingsFactsSection; a collection is a CollectionPage; a record's edit in a list is a RowEditForm.
+ * @behaviour With `save`: Save stays disabled until a field differs from what is saved, says `pendingLabel` while saving with Cancel held beside it, then calls `saved`, which the product answers with its own toast; the footer never shows a saved state. A failure keeps every value and shows under its field until that field changes, or above the footer until the next save. A `cancel` that runs work of its own says its `pendingLabel` while `pending`. Without `save`, the footer holds `footerHint` and `footer`, and is left out when both are.
+ * @words The title names the values ("Personal details"); the description says what changing them does, in one line; the hint is optional and says what is specific to this card: a limit ("Please use 32 characters at maximum."), what a value is for, the plan a feature needs, or a "Learn more" link, never one sentence every card repeats; Save and Saving come from the product's catalogue, and the saved toast from its notices.
+ * @access The title is the section's h2 and names the form that saves it. The saved toast is announced by the product's toast region; a failure under a field marks the control invalid and describes it.
  */
 function SettingsSection({ title, description, actions, columns = 1, children, className, save, footer, footerHint, ...props }) {
     const titleId = React.useId();

package/dist/components/switch.d.ts

@@ -3,12 +3,12 @@ import { Switch as SwitchPrimitive } from "@base-ui/react/switch";
  * A setting that is on or off.
  *
  * @family Choices
- * @when A setting that is either on or off, inside a settings section that saves.
+ * @when A setting that is either on or off, inside a settings section.
  * @instead Choosing or agreeing to something is a `Checkbox`. A tool button that stays pressed is a
  * `Toggle`. Choosing between named values is a `RadioGroup`.
  * @behaviour Off is the input grey, on is ink; the thumb travels 16 px. Space flips it. On a
- * settings page the change waits for the section's Save, which lights up; only Theme and Language
- * in the account menu apply at once. A failed save leaves the switch showing the true state.
+ * settings page the change applies at once and the product's toast confirms it. A failed change
+ * leaves the switch showing the true state.
  * @words The label names what on means: *Approvals*, with help saying when. Never *Enable
  * approvals*, and no On/Off text beside the switch.
  * @access `role="switch"` with `aria-checked`. The name is the visible label and stays the same in

package/dist/components/switch.js

@@ -5,12 +5,12 @@ import { cn } from "../lib/utils.js";
  * A setting that is on or off.
  *
  * @family Choices
- * @when A setting that is either on or off, inside a settings section that saves.
+ * @when A setting that is either on or off, inside a settings section.
  * @instead Choosing or agreeing to something is a `Checkbox`. A tool button that stays pressed is a
  * `Toggle`. Choosing between named values is a `RadioGroup`.
  * @behaviour Off is the input grey, on is ink; the thumb travels 16 px. Space flips it. On a
- * settings page the change waits for the section's Save, which lights up; only Theme and Language
- * in the account menu apply at once. A failed save leaves the switch showing the true state.
+ * settings page the change applies at once and the product's toast confirms it. A failed change
+ * leaves the switch showing the true state.
  * @words The label names what on means: *Approvals*, with help saying when. Never *Enable
  * approvals*, and no On/Off text beside the switch.
  * @access `role="switch"` with `aria-checked`. The name is the visible label and stays the same in

package/dist/components/theme-mode-switcher.d.ts

@@ -32,8 +32,8 @@ export type ThemeModeSwitcherProps = Omit<React.ComponentProps<typeof RadioGroup
 declare function ThemeModeSwitcher({ "aria-label": ariaLabel, className, compact, disabled, itemClassName, labels, onValueChange, renderItem, value, ...props }: ThemeModeSwitcherProps): React.JSX.Element;
 export { ThemeModeSwitcher };
 /**
- * The appearance as one row of a menu: its name and the current mode's glyph
- * leading, the three modes as compact choices at its end.
+ * The appearance as one row of a menu: its name leading, the three modes as a
+ * small round pill at its end.
  *
  * @family Menus
  * @when The account menu's Theme row, in the Portal and in Nadia.

package/dist/components/theme-mode-switcher.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"theme-mode-switcher.d.ts","sourceRoot":"","sources":["../../src/components/theme-mode-switcher.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,UAAU,EAAkB,MAAM,0BAA0B,CAAC;AAEtE,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,KAAK,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAG3E,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,CAAC;AACnC,YAAY,EAAE,SAAS,EAAE,CAAC;AAE1B,MAAM,MAAM,qBAAqB,GAAG,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;AAE9D,MAAM,MAAM,eAAe,GAAG;IAC5B,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC;IACzD,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,SAAS,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,IAAI,CACvC,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,EACvC,UAAU,GAAG,cAAc,GAAG,eAAe,GAAG,OAAO,CACxD,GAAG;IACF,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,MAAM,EAAE,qBAAqB,CAAC;IAC9B,aAAa,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC1C,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,KAAK,CAAC,SAAS,CAAC;IAC1D,KAAK,EAAE,SAAS,CAAC;CAClB,CAAC;AAQF;;;;;;;;;GASG;AACH,iBAAS,iBAAiB,CAAC,EACzB,YAAY,EAAE,SAAS,EACvB,SAAS,EACT,OAAe,EACf,QAAQ,EACR,aAAa,EACb,MAAM,EACN,aAAa,EACb,UAAU,EACV,KAAK,EACL,GAAG,KAAK,EACT,EAAE,sBAAsB,qBA6CxB;AAED,OAAO,EAAE,iBAAiB,EAAE,CAAC;AAE7B;;;;;;;;;;GAUG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,MAAM,EACN,KAAK,EACL,aAAa,EACb,QAAQ,GACT,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,qBAAqB,CAAC;IAC9B,KAAK,EAAE,SAAS,CAAC;IACjB,aAAa,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,qBAoBA"}
+{"version":3,"file":"theme-mode-switcher.d.ts","sourceRoot":"","sources":["../../src/components/theme-mode-switcher.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EAAE,UAAU,EAAkB,MAAM,0BAA0B,CAAC;AAEtE,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,KAAK,SAAS,EAAE,MAAM,kBAAkB,CAAC;AAG3E,OAAO,EAAE,WAAW,EAAE,UAAU,EAAE,CAAC;AACnC,YAAY,EAAE,SAAS,EAAE,CAAC;AAE1B,MAAM,MAAM,qBAAqB,GAAG,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,CAAC;AAE9D,MAAM,MAAM,eAAe,GAAG;IAC5B,IAAI,EAAE,KAAK,CAAC,aAAa,CAAC,KAAK,CAAC,QAAQ,CAAC,aAAa,CAAC,CAAC,CAAC;IACzD,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,SAAS,CAAC;IAChB,QAAQ,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,IAAI,CACvC,KAAK,CAAC,cAAc,CAAC,OAAO,UAAU,CAAC,EACvC,UAAU,GAAG,cAAc,GAAG,eAAe,GAAG,OAAO,CACxD,GAAG;IACF,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,MAAM,EAAE,qBAAqB,CAAC;IAC9B,aAAa,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC1C,UAAU,CAAC,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,KAAK,CAAC,SAAS,CAAC;IAC1D,KAAK,EAAE,SAAS,CAAC;CAClB,CAAC;AAQF;;;;;;;;;GASG;AACH,iBAAS,iBAAiB,CAAC,EACzB,YAAY,EAAE,SAAS,EACvB,SAAS,EACT,OAAe,EACf,QAAQ,EACR,aAAa,EACb,MAAM,EACN,aAAa,EACb,UAAU,EACV,KAAK,EACL,GAAG,KAAK,EACT,EAAE,sBAAsB,qBA6CxB;AAED,OAAO,EAAE,iBAAiB,EAAE,CAAC;AAE7B;;;;;;;;;;GAUG;AACH,wBAAgB,aAAa,CAAC,EAC5B,KAAK,EACL,MAAM,EACN,KAAK,EACL,aAAa,EACb,QAAQ,GACT,EAAE;IACD,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,qBAAqB,CAAC;IAC9B,KAAK,EAAE,SAAS,CAAC;IACjB,aAAa,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IAC1C,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,qBAkBA"}

package/dist/components/theme-mode-switcher.js

@@ -36,8 +36,8 @@ function ThemeModeSwitcher({ "aria-label": ariaLabel, className, compact = false
 }
 export { ThemeModeSwitcher };
 /**
- * The appearance as one row of a menu: its name and the current mode's glyph
- * leading, the three modes as compact choices at its end.
+ * The appearance as one row of a menu: its name leading, the three modes as a
+ * small round pill at its end.
  *
  * @family Menus
  * @when The account menu's Theme row, in the Portal and in Nadia.
@@ -47,8 +47,7 @@ export { ThemeModeSwitcher };
  * @access A radio group inside the menu, named by the row's label; each mode is a menu radio item with its name.
  */
 export function ThemeModeMenu({ label, labels, value, onValueChange, disabled, }) {
-    const CurrentModeIcon = themeModeIcons[value];
-    return (_jsx(MenuChoiceRow, { "data-slot": "theme-mode-menu", icon: _jsx(CurrentModeIcon, { "aria-hidden": "true" }), label: label, disabled: disabled, value: value, onValueChange: onValueChange, options: themeModes.map((mode) => {
+    return (_jsx(MenuChoiceRow, { "data-slot": "theme-mode-menu", label: label, disabled: disabled, value: value, onValueChange: onValueChange, options: themeModes.map((mode) => {
             const Icon = themeModeIcons[mode];
             return {
                 value: mode,

package/dist/internal/settings-save.d.ts

@@ -12,9 +12,9 @@ export type SettingsSave = {
     label: string;
     /** "Saving" */
     pendingLabel: string;
-    /** "Saved" */
-    savedLabel: string;
-    /** The footer's left side until a save: "Saved for every device you sign in on." */
+    /** Called once a save resolves null: the product announces it through its own toast. */
+    saved: () => void;
+    /** What is specific to this card, on the footer's left: a limit, what a value is for, a plan it needs, a link. Absent: nothing. */
     hint?: ReactNode;
     /**
      * An in-place edit of an object's section closes without saving. A cancel that runs work of its own, such as

package/dist/internal/settings-save.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"settings-save.d.ts","sourceRoot":"","sources":["../../src/internal/settings-save.tsx"],"names":[],"mappings":"AAGA,OAAO,EAEL,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AAOf,OAAO,EAAoB,KAAK,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAOtF,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,EAAE,eAAe,CAAC;IACzB,2FAA2F;IAC3F,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,+DAA+D;IAC/D,MAAM,EAAE,CAAC,QAAQ,EAAE,QAAQ,KAAK,OAAO,CAAC,mBAAmB,GAAG,IAAI,CAAC,CAAC;IACpE,aAAa;IACb,KAAK,EAAE,MAAM,CAAC;IACd,eAAe;IACf,YAAY,EAAE,MAAM,CAAC;IACrB,cAAc;IACd,UAAU,EAAE,MAAM,CAAC;IACnB,oFAAoF;IACpF,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,MAAM,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,IAAI,CAAC;QAAC,OAAO,CAAC,EAAE,OAAO,CAAC;QAAC,YAAY,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC3F;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAsHF,wBAAgB,gBAAgB,CAAC,EAC/B,IAAI,EACJ,OAAO,EACP,QAAQ,GACT,EAAE;IACD,IAAI,EAAE,YAAY,CAAC;IACnB,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,SAAS,CAAC;CACrB,+BAoFA;AAED,wBAAgB,oBAAoB,CAAC,EAAE,EAAE,EAAE,EAAE;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,sCA2B1D"}
+{"version":3,"file":"settings-save.d.ts","sourceRoot":"","sources":["../../src/internal/settings-save.tsx"],"names":[],"mappings":"AAEA,OAAO,EAEL,KAAK,SAAS,EAMf,MAAM,OAAO,CAAC;AAOf,OAAO,EAAoB,KAAK,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAOtF,MAAM,MAAM,mBAAmB,GAAG;IAChC,OAAO,EAAE,eAAe,CAAC;IACzB,2FAA2F;IAC3F,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG;IACzB,+DAA+D;IAC/D,MAAM,EAAE,CAAC,QAAQ,EAAE,QAAQ,KAAK,OAAO,CAAC,mBAAmB,GAAG,IAAI,CAAC,CAAC;IACpE,aAAa;IACb,KAAK,EAAE,MAAM,CAAC;IACd,eAAe;IACf,YAAY,EAAE,MAAM,CAAC;IACrB,wFAAwF;IACxF,KAAK,EAAE,MAAM,IAAI,CAAC;IAClB,mIAAmI;IACnI,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB;;;OAGG;IACH,MAAM,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,MAAM,IAAI,CAAC;QAAC,OAAO,CAAC,EAAE,OAAO,CAAC;QAAC,YAAY,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAC3F;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAgGF,wBAAgB,gBAAgB,CAAC,EAC/B,IAAI,EACJ,OAAO,EACP,QAAQ,GACT,EAAE;IACD,IAAI,EAAE,YAAY,CAAC;IACnB,OAAO,EAAE,MAAM,CAAC;IAChB,QAAQ,EAAE,SAAS,CAAC;CACrB,+BAkFA;AAED,wBAAgB,oBAAoB,CAAC,EAAE,EAAE,EAAE,EAAE;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,sCA2B1D"}

package/dist/internal/settings-save.js

@@ -1,6 +1,5 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { CircleCheck } from "lucide-react";
 import { createContext, use, useCallback, useEffect, useRef, useState, } from "react";
 import { useFormStatus } from "react-dom";
 import { Button } from "../components/button.js";
@@ -54,9 +53,9 @@ function editableValues(form) {
         ? [name, [value.name, value.size, value.type, value.lastModified]]
         : [name, value]));
 }
-function SaveFooter({ save, changed, saved, }) {
+function SaveFooter({ save, changed }) {
     const { pending } = useFormStatus();
-    return (_jsxs(FooterStrip, { hint: _jsx("div", { role: "status", children: saved ? (_jsxs("span", { className: "inline-flex items-center gap-1.5 text-success", children: [_jsx(CircleCheck, { "aria-hidden": "true", className: "size-4" }), save.savedLabel] })) : (save.hint) }), hintSlot: "settings-section-hint", children: [save.cancel ? (_jsx(Button, { "aria-busy": save.cancel.pending || undefined, disabled: pending || save.cancel.pending, onClick: save.cancel.onCancel, type: "button", variant: "outline", children: _jsx(PendingLabel, { pending: save.cancel.pending ?? false, pendingLabel: save.cancel.pendingLabel ?? save.cancel.label, children: save.cancel.label }) })) : null, _jsx(FormSubmitButton, { submit: {
+    return (_jsxs(FooterStrip, { hint: save.hint, hintSlot: "settings-section-hint", children: [save.cancel ? (_jsx(Button, { "aria-busy": save.cancel.pending || undefined, disabled: pending || save.cancel.pending, onClick: save.cancel.onCancel, type: "button", variant: "outline", children: _jsx(PendingLabel, { pending: save.cancel.pending ?? false, pendingLabel: save.cancel.pendingLabel ?? save.cancel.label, children: save.cancel.label }) })) : null, _jsx(FormSubmitButton, { submit: {
                     label: save.label,
                     pendingLabel: save.pendingLabel,
                     pending,
@@ -66,7 +65,6 @@ function SaveFooter({ save, changed, saved, }) {
 export function SettingsSaveForm({ save, titleId, children, }) {
     const [fieldsChanged, setFieldsChanged] = useState(false);
     const [failure, setFailure] = useState(null);
-    const [saved, setSaved] = useState(false);
     const [claimedFields, setClaimedFields] = useState(() => new Set());
     const submittedValues = useRef(null);
     const keepValuesOnReset = useRef(false);
@@ -103,20 +101,20 @@ export function SettingsSaveForm({ save, titleId, children, }) {
                 const result = await save.action(formData);
                 keepValuesOnReset.current = result !== null;
                 setFailure(result);
-                setSaved(result === null);
+                if (result === null)
+                    save.saved();
             }, onChange: (event) => {
                 const edited = event.target;
                 if (edited instanceof Element &&
                     failure?.field !== undefined &&
                     edited.id === failure.field)
                     setFailure(null);
-                setSaved(false);
                 setFieldsChanged(hasChangedFields(event.currentTarget));
             }, onSubmit: (event) => {
                 setFailure(null);
                 keepValuesOnReset.current = false;
                 submittedValues.current = editableValues(event.currentTarget);
-            }, children: [_jsx("fieldset", { className: "contents", disabled: !hydrated, children: children }), sectionFailure ? (_jsx(CardContent, { children: _jsx(MessageNotice, { message: sectionFailure.message, placement: "action" }) })) : null, _jsx(SaveFooter, { changed: changed, save: save, saved: saved && !changed })] }) }));
+            }, children: [_jsx("fieldset", { className: "contents", disabled: !hydrated, children: children }), sectionFailure ? (_jsx(CardContent, { children: _jsx(MessageNotice, { message: sectionFailure.message, placement: "action" }) })) : null, _jsx(SaveFooter, { changed: changed, save: save })] }) }));
 }
 export function SettingsFieldFailure({ id }) {
     const context = use(SettingsSaveContext);

package/dist/showcase/specimens/compositions.js

@@ -236,8 +236,8 @@ function SettingsSectionSpecimen() {
             action: async () => null,
             label: "Save",
             pendingLabel: "Saving",
-            savedLabel: "Saved",
-            hint: "Saved for every device you sign in on.",
+            saved: () => undefined,
+            hint: "Please use 32 characters at maximum.",
         }, title: "Sender", children: _jsx(SettingsField, { id: "showcase-sender-name", label: "Sender name", children: ({ controlProps }) => (_jsx(Input, { ...controlProps, defaultValue: "Acme Quotes", name: "senderName" })) }) }));
 }
 export const COMPOSITIONS = {

package/dist/showcase/specimens/menus.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"menus.d.ts","sourceRoot":"","sources":["../../../src/showcase/specimens/menus.tsx"],"names":[],"mappings":"AAuFA,iBAAS,mBAAmB,gCA+B3B;AAED,iBAAS,gBAAgB,gCAoBxB;AAED,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;CA0IS,CAAC"}
+{"version":3,"file":"menus.d.ts","sourceRoot":"","sources":["../../../src/showcase/specimens/menus.tsx"],"names":[],"mappings":"AAuFA,iBAAS,mBAAmB,gCA8B3B;AAED,iBAAS,gBAAgB,gCAoBxB;AAED,eAAO,MAAM,KAAK;;;;;;;;;;;;;;;CA0IS,CAAC"}

package/dist/showcase/specimens/menus.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Copy, Languages, Pencil, Settings2 } from "lucide-react";
+import { Copy, Pencil, Settings2 } from "lucide-react";
 import { useState } from "react";
 import { AccountMenu } from "../../components/account-menu.js";
 import { ActionContextMenu, ActionMenu } from "../../components/action-menu.js";
@@ -24,7 +24,6 @@ function AccountMenuSpecimen() {
     const [theme, setTheme] = useState("system");
     const [language, setLanguage] = useState("en");
     return (_jsx("div", { className: "max-w-xs", children: _jsx(AccountMenu, { commands: [{ label: "Usage", icon: _jsx(Settings2, {}), value: "62% left", onClick: nothing }], identity: { name: "Ada Rossi", initials: "AR", lines: ["ada@acme.it"] }, label: "Account: Ada Rossi", language: {
-                icon: _jsx(Languages, {}),
                 label: "Language",
                 onValueChange: setLanguage,
                 options: [

package/dist/showcase/usage.generated.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"usage.generated.d.ts","sourceRoot":"","sources":["../../src/showcase/usage.generated.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"usage.generated.d.ts","sourceRoot":"","sources":["../../src/showcase/usage.generated.ts"],"names":[],"mappings":"AAGA,MAAM,MAAM,SAAS,GACjB,cAAc,GACd,kBAAkB,GAClB,eAAe,GACf,mBAAmB,GACnB,gBAAgB,GAChB,mBAAmB,GACnB,eAAe,GACf,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,cAAc,GACd,YAAY,GACZ,eAAe,GACf,cAAc,GACd,YAAY,GACZ,YAAY,GACZ,aAAa,GACb,aAAa,GACb,cAAc,GACd,iBAAiB,GACjB,QAAQ,GACR,aAAa,GACb,YAAY,GACZ,aAAa,GACb,UAAU,GACV,kBAAkB,GAClB,OAAO,GACP,MAAM,GACN,OAAO,GACP,YAAY,GACZ,UAAU,GACV,OAAO,GACP,cAAc,GACd,eAAe,GACf,QAAQ,GACR,UAAU,GACV,UAAU,GACV,gBAAgB,GAChB,UAAU,GACV,aAAa,GACb,YAAY,GACZ,iBAAiB,GACjB,QAAQ,GACR,QAAQ,GACR,mBAAmB,GACnB,QAAQ,GACR,aAAa,GACb,cAAc,GACd,UAAU,GACV,SAAS,GACT,UAAU,GACV,QAAQ,GACR,OAAO,GACP,eAAe,GACf,cAAc,GACd,cAAc,GACd,WAAW,GACX,eAAe,GACf,WAAW,GACX,cAAc,GACd,gBAAgB,GAChB,aAAa,GACb,WAAW,GACX,KAAK,GACL,cAAc,GACd,YAAY,GACZ,eAAe,GACf,gBAAgB,GAChB,iBAAiB,GACjB,QAAQ,GACR,gBAAgB,GAChB,YAAY,GACZ,oBAAoB,GACpB,eAAe,GACf,SAAS,GACT,iBAAiB,GACjB,MAAM,GACN,SAAS,GACT,kBAAkB,GAClB,WAAW,GACX,aAAa,GACb,MAAM,GACN,SAAS,GACT,WAAW,GACX,WAAW,GACX,WAAW,GACX,eAAe,GACf,UAAU,GACV,MAAM,GACN,KAAK,GACL,YAAY,GACZ,aAAa,GACb,aAAa,GACb,UAAU,GACV,QAAQ,GACR,YAAY,GACZ,aAAa,GACb,sBAAsB,GACtB,WAAW,GACX,OAAO,GACP,WAAW,GACX,YAAY,GACZ,YAAY,GACZ,OAAO,GACP,YAAY,GACZ,eAAe,GACf,gBAAgB,GAChB,WAAW,GACX,iBAAiB,GACjB,eAAe,GACf,cAAc,GACd,cAAc,GACd,UAAU,GACV,SAAS,GACT,SAAS,GACT,YAAY,GACZ,aAAa,GACb,aAAa,GACb,mBAAmB,GACnB,YAAY,GACZ,aAAa,GACb,aAAa,GACb,QAAQ,GACR,QAAQ,GACR,cAAc,GACd,cAAc,GACd,eAAe,GACf,SAAS,GACT,SAAS,GACT,OAAO,GACP,eAAe,GACf,kBAAkB,GAClB,kBAAkB,GAClB,oBAAoB,GACpB,kBAAkB,GAClB,iBAAiB,GACjB,WAAW,GACX,gBAAgB,GAChB,gBAAgB,GAChB,kBAAkB,GAClB,SAAS,GACT,YAAY,GACZ,sBAAsB,GACtB,WAAW,GACX,aAAa,GACb,YAAY,GACZ,UAAU,GACV,aAAa,GACb,aAAa,GACb,aAAa,GACb,YAAY,GACZ,iBAAiB,GACjB,WAAW,GACX,eAAe,GACf,eAAe,GACf,oBAAoB,GACpB,eAAe,GACf,qBAAqB,GACrB,YAAY,GACZ,WAAW,GACX,UAAU,CAAC;AAEf,MAAM,MAAM,WAAW,GACnB,cAAc,GACd,SAAS,GACT,QAAQ,GACR,SAAS,GACT,QAAQ,GACR,YAAY,GACZ,MAAM,GACN,UAAU,GACV,OAAO,GACP,QAAQ,GACR,OAAO,CAAC;AAEZ,MAAM,MAAM,cAAc,GAAG;IAC3B,IAAI,EAAE,SAAS,CAAC;IAChB,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,EAAE,WAAW,CAAC;IACpB,OAAO,EAAE,MAAM,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,SAAS,WAAW,EAYhD,CAAC;AAEF,eAAO,MAAM,KAAK,EAAE,SAAS,cAAc,EAyyE1C,CAAC"}

package/dist/showcase/usage.generated.js

@@ -218,8 +218,8 @@ export const USAGE = [
         family: "Compositions",
         summary: "A page of settings: a centred column of section cards, each saving its own values.",
         when: "A place whose job is changing how something behaves: an account's profile, a company's identity, Nadia's notifications.",
-        instead: "One object's page with a settings card among its sections is an ObjectPage; Theme and Language, which apply on change, stay in the account menu.",
-        behaviour: "The sections stack 20 apart in a centred column at most 56rem wide. The page draws no header and no save of its own: each SettingsSection saves from its footer.",
+        instead: "One object's page with a settings card among its sections is an ObjectPage.",
+        behaviour: "The sections stack 20 apart in a centred column at most 56rem wide. The page draws no header and no save of its own: a choice applies at once, and each SettingsSection of typed values saves from its footer.",
         words: '`title` names the place as the navigation does ("Profile"); the sections\' titles and lines carry the rest.',
         access: "`title` becomes a visually hidden h1 for a product whose chrome shows the place without a heading; leave it out where the chrome already draws the h1.",
     },
@@ -228,11 +228,11 @@ export const USAGE = [
         module: "settings-section",
         family: "Compositions",
         summary: "A card of related settings that says what changing them does and saves them from its own footer.",
-        when: "A few related values a person changes and saves together, on a SettingsPage or as a section of an ObjectPage: Personal details, Company identity, Notifications.",
-        instead: "Read-only values are a SettingsFactsSection; Theme and Language, which apply on change, live in the account menu; a record's edit in a list is a RowEditForm.",
-        behaviour: "With `save`: Save stays disabled until a field differs from what is saved, says `pendingLabel` while saving with Cancel held beside it, then the footer shows the ok check and `savedLabel` until the next change. A failure keeps every value and shows under its field until that field changes, or above the footer until the next save. A `cancel` that runs work of its own says its `pendingLabel` while `pending`. Without `save`, the footer holds `footerHint` and `footer`, and is left out when both are.",
-        words: 'The title names the values ("Personal details"); the description says what changing them does, in one line; the hint says where the save applies ("Saved for every device you sign in on."); Save, Saving and Saved come from the product\'s catalogue.',
-        access: "The title is the section's h2 and names the form that saves it. The footer's hint and saved line are one status, announced politely; a failure under a field marks the control invalid and describes it.",
+        when: "A few related settings on a SettingsPage or as a section of an ObjectPage: choices that apply at once, without `save` (Notifications), or typed values a person saves together, with `save` (Personal details, Company identity).",
+        instead: "Read-only values are a SettingsFactsSection; a collection is a CollectionPage; a record's edit in a list is a RowEditForm.",
+        behaviour: "With `save`: Save stays disabled until a field differs from what is saved, says `pendingLabel` while saving with Cancel held beside it, then calls `saved`, which the product answers with its own toast; the footer never shows a saved state. A failure keeps every value and shows under its field until that field changes, or above the footer until the next save. A `cancel` that runs work of its own says its `pendingLabel` while `pending`. Without `save`, the footer holds `footerHint` and `footer`, and is left out when both are.",
+        words: 'The title names the values ("Personal details"); the description says what changing them does, in one line; the hint is optional and says what is specific to this card: a limit ("Please use 32 characters at maximum."), what a value is for, the plan a feature needs, or a "Learn more" link, never one sentence every card repeats; Save and Saving come from the product\'s catalogue, and the saved toast from its notices.',
+        access: "The title is the section's h2 and names the form that saves it. The saved toast is announced by the product's toast region; a failure under a field marks the control invalid and describes it.",
     },
     {
         name: "Button",
@@ -492,9 +492,9 @@ export const USAGE = [
         module: "switch",
         family: "Choices",
         summary: "A setting that is on or off.",
-        when: "A setting that is either on or off, inside a settings section that saves.",
+        when: "A setting that is either on or off, inside a settings section.",
         instead: "Choosing or agreeing to something is a `Checkbox`. A tool button that stays pressed is a `Toggle`. Choosing between named values is a `RadioGroup`.",
-        behaviour: "Off is the input grey, on is ink; the thumb travels 16 px. Space flips it. On a settings page the change waits for the section's Save, which lights up; only Theme and Language in the account menu apply at once. A failed save leaves the switch showing the true state.",
+        behaviour: "Off is the input grey, on is ink; the thumb travels 16 px. Space flips it. On a settings page the change applies at once and the product's toast confirms it. A failed change leaves the switch showing the true state.",
         words: "The label names what on means: *Approvals*, with help saying when. Never *Enable approvals*, and no On/Off text beside the switch.",
         access: '`role="switch"` with `aria-checked`. The name is the visible label and stays the same in both states. `sm` only inside a dense row.',
     },
@@ -1308,7 +1308,7 @@ export const USAGE = [
         summary: "The account menu at the foot of a shell's navigation: whose account it is, and the menu opening on that same identity with what they can do beneath it.",
         when: "The account at the sidebar's foot in the Portal, Nadia and Alveare: the gear to the account's settings, Theme, Language, a product's own settings, its commands, and Sign out.",
         instead: "A record's or a page's commands are an ActionMenu; a setting with more than a few options or one that needs a Save belongs on a SettingsPage.",
-        behaviour: "The menu opens upward on the identity. In order: the gear, Theme, Language, the product's choices as submenus, its commands with any reading at their end, and Sign out last in the error colour. Theme and Language apply at once and keep the menu open. While signing out, Sign out says its pending word, the menu stays open and the trigger is locked; a failure shows under it. A Sign out that `confirms` closes the menu instead, for the product's own confirmation.",
+        behaviour: "The menu opens 6 px above its trigger, 288 px wide, as Vercel's does: a header of the name and every line under it with the gear at its end, one divider, then 36 px rows, each its label leading and its icon or control trailing: Theme and Language as small round pills, the product's choices as submenus, its commands with any reading before their icon, and Sign out last. Theme and Language apply at once and keep the menu open. While signing out, Sign out says its pending word, the menu stays open and the trigger is locked; a failure shows under it. A Sign out that `confirms` closes the menu instead, for the product's own confirmation.",
         words: 'The menu\'s name ("Account"), the person\'s name and lines, then each row\'s noun or verb from the product\'s catalogue: "Theme", "Language", "Usage", "Sign out" and "Signing out".',
         access: 'The trigger and the menu are named "{label}: {name}"; the gear carries its label; the pending sign-out is aria-busy and announced through a status; a failure is an alert.',
     },
@@ -1404,12 +1404,12 @@ export const USAGE = [
         name: "MenuChoiceRow",
         module: "menu-choice-row",
         family: "Menus",
-        summary: "A named preference inside a menu: its icon and label at the leading edge, the exclusive choices together at the trailing edge, close enough to read as one control.",
+        summary: "A named preference inside a menu: its label at the leading edge and the exclusive choices in one small round pill at the trailing edge, as Vercel's account menu draws Theme.",
         when: "A setting that applies at once from inside a menu: the account menu's Theme and Language.",
         instead: "A product's own setting with more choices or longer names is a submenu of radio items (`AccountMenu`'s `choices`). A setting on a page is a `ToggleGroup` or a `Select` in its section.",
-        behaviour: "Icon and label lead, on the commands' 12 px line; the choices sit in one bordered group at the trailing edge. Choosing applies at once and keeps the menu open, so the result shows without reopening it.",
+        behaviour: "The label leads on the row's 36 px line; the choices sit in one round pill at the trailing edge, the chosen one ringed. Choosing applies at once and keeps the menu open, so the result shows without reopening it.",
         words: 'The label is a noun: "Theme", "Language". Each choice carries a full name even when it shows a glyph or a short code: "EN" is named "English".',
-        access: "A radio group named by the label; each choice is a radio named by its `label`, with the same text as its tooltip. The icon is hidden.",
+        access: "A radio group named by the label; each choice is a radio named by its `label`, with the same text as its tooltip.",
     },
     {
         name: "Menubar",
@@ -1448,7 +1448,7 @@ export const USAGE = [
         name: "ThemeModeMenu",
         module: "theme-mode-switcher",
         family: "Menus",
-        summary: "The appearance as one row of a menu: its name and the current mode's glyph leading, the three modes as compact choices at its end.",
+        summary: "The appearance as one row of a menu: its name leading, the three modes as a small round pill at its end.",
         when: "The account menu's Theme row, in the Portal and in Nadia.",
         instead: "On a settings page the choice is ThemeModeSwitcher, with its names shown.",
         behaviour: "Choosing a mode applies it at once and keeps the menu open, so the result shows without reopening it. The order is System, Light, Dark.",

package/dist/standalone/index.js

@@ -1,3 +1,3 @@
 export const agentOrbScript = "\"use strict\";(()=>{function U(n,e,t){return n+(e-n)*t}function at(n){return n-Math.floor(n)}function V(n,e){let t=Math.floor(n),a=Math.floor(e),o=n-t,s=e-a;o=o*o*(3-2*o),s=s*s*(3-2*s);let r=_(t,a),u=_(t+1,a),c=_(t,a+1),M=_(t+1,a+1);return r+(u-r)*o+(c-r)*s+(r-u-c+M)*o*s}function _(n,e){let t=Math.sin(n*12.9898+e*78.233)*43758.5453;return t-Math.floor(t)}function J(n,e){let t=Math.PI*(3-Math.sqrt(5)),a=1-2*(n+.5)/e,o=Math.sqrt(1-a*a),s=n*t;return[o*Math.cos(s),a,o*Math.sin(s)]}function Pt(n,e){return Math.atan2(Math.sin(n-e),Math.cos(n-e))}function j(n,e,t,a,o){let s=Math.sin(e),r=Math.cos(e),u=Math.sin(n),c=Math.cos(n);return(M,O,l)=>{let i=M*c+l*u,p=-M*u+l*c,m=O*r-p*s,b=O*s+p*r;return[t+i*o,a-m*o,b]}}function rt(n,e,t,a){if(!a){let s=Math.round((t?1-n:n)*255);return`rgba(${s},${s},${s},${e})`}let o=s=>Math.round(t?s*(1-n):s+(255-s)*n);return`rgba(${o(a.r)},${o(a.g)},${o(a.b)},${e})`}function it(n,e,t,a=.3,o){for(let s of e){let r=s.a??1,u=Math.min(1,Math.max(0,s.white));n.fillStyle=rt(u,r,t,o),n.beginPath(),n.arc(s.x,s.y,s.r,0,Math.PI*2),n.fill()}}function ct(n,e,t,a){for(let o of e){let s=o.a??1,r=Math.min(1,Math.max(0,o.white));n.strokeStyle=rt(r,s,t,a),n.lineWidth=o.w,n.beginPath(),n.moveTo(o.x1,o.y1),n.lineTo(o.x2,o.y2),n.stroke()}}function q(n,e,t=.3){let a=[];for(let o of n)(o.a??1)<.02||(o.r=Math.max(t,o.r),a.push(o));return a.sort((o,s)=>o.z-s.z),{dots:a,lines:e.filter(o=>(o.a??1)>=.02)}}function ht(n,e,t,a){e.lines.length&&ct(n,e.lines,t,a),it(n,e.dots,t,.3,a)}function $(n,e){return(n/300)**e}var St=[[\"latRings\",\"lonDensity\"],[\"rings\",\"lonDensity\"],[\"lanes\",\"segs\"]],At=[\"orbitN\",\"ghostN\",\"nodeN\",\"strandN\",\"signals\"],vt=[\"iconD\"],kt=[\"rBase\",\"rDepth\",\"rActive\",\"rDot\",\"ghostR\",\"partR\",\"partRDepth\",\"nodeR\",\"nodeRDepth\"];function Rt(n,e){let t={...n},a=new Set,o=Math.sqrt(e);for(let[s,r]of St){let u=t[s],c=t[r];u!=null&&c!=null&&!a.has(s)&&!a.has(r)&&(t[s]=Math.max(2,Math.round(u*o)),t[r]=Math.max(2,Math.round(c*o)),a.add(s),a.add(r))}for(let s of At){let r=t[s];r!=null&&r!==0&&!a.has(s)&&(t[s]=Math.max(1,Math.round(r*e)))}for(let s of vt){let r=t[s];r!=null&&(t[s]=Math.max(.02,r*e))}return t}function Dt(n,e){let t={...n};for(let a of kt){let o=t[a];o!=null&&(t[a]=o*e)}return t.rSizeMul=(t.rSizeMul??1)*e,t}var zt={globe:{latRings:17,lonDensity:44,rBase:.6,rDepth:1.7,rBoost:1,inkFar:.62,inkSpan:.54,rsPow:.6,rMin:.3},orbits:{orbitN:12,ghostN:40,ghostR:.9,ghostA:.5,particles:3,partR:1.2,partRDepth:1.6,rsPow:.6,rMin:.3},rubik:{latRings:15,lonDensity:40,moveCount:14,rBase:.6,rDepth:1.7,rActive:.3,inkFar:.62,inkSpan:.54,rsPow:.6,rMin:.3},wave:{rings:15,lonDensity:40,rBase:.6,rDepth:1.7,rsPow:.6,rMin:.3},web:{nodeN:30,thr:.72,signals:5,nodeR:1.4,nodeRDepth:1.8,lineW:.8,rsPow:.6,rMin:.3},braid:{strandN:52,turns:3,ghostN:150,rBase:1.2,rDepth:1.8,rsPow:.6,rMin:.3},ribbon:{lanes:5,segs:88,ghostN:150,rBase:1.1,rDepth:1.7,rsPow:.6,rMin:.3},ring:{lanes:5,segs:88,ghostN:0,faceOn:1,rBase:1.1,rDepth:1.7,rsPow:.6,rMin:.3},morph:{rDot:.021,iconD:1,rMin:.25}},It=(n,e,t)=>{let a=n/2,o=n/2,s=n/2*.76,r=j(e*.4,.3,a,o,1),u=$(n,t.rsPow??.6),c=[],M=t.ghostN??150;for(let i=0;i<M;i++){let p=J(i,M),[m,b,h]=r(p[0]*s,p[1]*s,p[2]*s),g=(h/s+1)/2;c.push({x:m,y:b,z:h,r:.8*u,white:.78,a:.1+.22*g})}let O=t.strandN??52,l=t.turns??3;for(let i=0;i<3;i++){let p=i/3*2*Math.PI;for(let m=0;m<O;m++){let b=(at(m/O+e*.045)*2-1)*.96,h=Math.sqrt(Math.max(0,1-b*b)),g=Math.min(1,(1-Math.abs(b))/.1),y=b*Math.PI*l+p,f=1+.075*Math.sin(b*Math.PI*l*2+p*2+e*.8),d=h*s*f,[x,S,w]=r(Math.cos(y)*d,b*s*f,Math.sin(y)*d),P=(w/s+1)/2;c.push({x,y:S,z:w,r:((t.rBase??1.2)+(t.rDepth??1.8)*P)*u,white:.55-.45*P,a:g*(.45+.55*P)})}}return q(c,[],t.rMin)};function Ct(n,e,t,a){let o=2*e*t+a,s=n%o,r=new Array(e).fill(0),u=-1;if(s<2*e*t){let c=Math.floor(s/t),M=(s-c*t)/t,l=1-(1-Math.min(1,M/.7))**3;if(c<e){for(let i=0;i<c;i++)r[i]=1;r[c]=l,u=c}else{let i=2*e-1-c;for(let p=0;p<i;p++)r[p]=1;r[i]=1-l,u=i}}return{amount:r,active:u}}function Et(n,e,t){let[a,o,s]=n,r=!1;for(let u=0;u<e.length;u++){if(t.amount[u]<=0)continue;let c=e[u],M=c.axis===0?a:c.axis===1?o:s;if(M<c.lo||M>=c.hi)continue;u===t.active&&(r=!0);let O=c.ang*t.amount[u],l=Math.cos(O),i=Math.sin(O);if(c.axis===0){let p=o*l-s*i;s=o*i+s*l,o=p}else if(c.axis===1){let p=a*l+s*i;s=-a*i+s*l,a=p}else{let p=a*l-o*i;o=a*i+o*l,a=p}}return[a,o,s,r]}function Ft(n){let e=[];for(let t=0;t<n;t++){let a=Math.min(2,Math.floor(_(t,2.3)*3)),o=-1+.5*Math.min(3,Math.floor(_(t,5.9)*4)),s=_(t,7.7)<.5?1:-1;e.push({axis:a,lo:o,hi:o+.5,ang:s*Math.PI/2})}return e}var Nt=(n,e,t)=>{let o=n/2,s=n/2,r=n/2*.82,u=.4+.06*Math.sin(e*.35),c=j(e*.5,u,o,s,r),M=e*(.5+(1.7-.5)*(t.scanMul??1)),O=$(n,t.rsPow??.6),l=t.dimBase??1,i=[],p=t.latRings??17,m=t.lonDensity??44;for(let b=0;b<=p;b++){let h=-Math.PI/2+b/p*Math.PI,g=Math.cos(h),y=Math.sin(h),f=Math.max(1,Math.round(Math.abs(g)*m));for(let d=0;d<f;d++){let x=d/f*2*Math.PI,[S,w,P]=c(g*Math.cos(x),y,g*Math.sin(x)),v=(P+1)/2,R=Pt(x+e*.5,M),k=Math.exp(-(R*R)/.18)*Math.max(0,P);i.push({x:S,y:w,z:P,r:((t.rBase??.6)+(t.rDepth??1.7)*v+(t.rBoost??1)*k)*O,white:(t.inkFar??.62)-(t.inkSpan??.54)*v,a:l+(1-l)*Math.min(1,k)})}}return q(i,[],t.rMin)},Bt=(n,e,t)=>{let a=n/2,o=n/2,s=n/2*.82,r=j(e*.55,.35+.1*Math.sin(e*.9),a,o,s),u=$(n,t.rsPow??.6),c=t.moveCount??14,M=Ft(c),O=Ct(e,c,.42,1.2),l=[],i=t.latRings??15,p=t.lonDensity??40;for(let m=0;m<=i;m++){let b=-Math.PI/2+m/i*Math.PI,h=Math.cos(b),g=Math.sin(b),y=Math.max(1,Math.round(Math.abs(h)*p));for(let f=0;f<y;f++){let d=f/y*2*Math.PI,[x,S,w,P]=Et([h*Math.cos(d),g,h*Math.sin(d)],M,O),[v,R,k]=r(x,S,w),D=(k+1)/2;l.push({x:v,y:R,z:k,r:((t.rBase??.6)+(t.rDepth??1.7)*D+(P?t.rActive??.3:0))*u,white:(t.inkFar??.62)-(t.inkSpan??.54)*D-(P?.14:0)})}}return q(l,[],t.rMin)},Lt=(n,e,t)=>{let a=n/2,o=n/2,s=n/2*.874,r=j(e*.18,.38,a,o,1),u=$(n,t.rsPow??.6),c=[],M=t.rings??15,O=t.lonDensity??40;for(let l=0;l<=M;l++){let i=-Math.PI/2+l/M*Math.PI,p=Math.cos(i),m=Math.sin(i),b=.62*Math.sin(e*2.1-l*.52)+.38*Math.sin(e*1.27+l*.83),h=s*(.88+.105*b),g=Math.max(1,Math.round(Math.abs(p)*O));for(let y=0;y<g;y++){let f=y/g*2*Math.PI,[d,x,S]=r(p*Math.cos(f)*h,m*h,p*Math.sin(f)*h),w=(S/s+1)/2,P=Math.max(0,b);c.push({x:d,y:x,z:S,r:((t.rBase??.6)+(t.rDepth??1.7)*w)*(1+.4*P)*u,white:.66-.56*w-.1*P})}}return q(c,[],t.rMin)};function Tt(n){return n*n*(3-2*n)}function lt(n){let e=n.length,t=[],a=0;for(let o=0;o<e;o++){let s=n[o],r=n[(o+1)%e],u=Math.hypot(r[0]-s[0],r[1]-s[1]);t.push(u),a+=u}return o=>{let s=o*a,r=0;for(;s>t[r]&&r<e-1;)s-=t[r],r++;let u=n[r],c=n[(r+1)%e],M=t[r]?Math.min(1,s/t[r]):0;return[u[0]+(c[0]-u[0])*M,u[1]+(c[1]-u[1])*M]}}var _t=n=>{let e=-Math.PI/2+n*2*Math.PI;return[Math.cos(e)*.24,Math.sin(e)*.24]},qt=lt([[0,-.26],[.24,.16],[-.24,.16]]),jt=lt([[0,-.2],[.2,-.2],[.2,.2],[-.2,.2],[-.2,-.2]]),Q=[_t,qt,jt];function $t(n){return Math.max(6,Math.round(34*n))}var X=1.4,ut=.9,Y=X+ut,Wt=(n,e,t)=>{let a=Q.length,o=e%(Y*a),s=t.shape!=null&&t.shape>=0&&t.shape<a?Math.floor(t.shape):-1,r=s>=0?s:Math.floor(o/Y),u=s>=0?e%Y:o-r*Y,c=s>=0?0:u>X?Tt((u-X)/ut):0,M=t.spread??1,O=Q[r],l=s>=0?O:Q[(r+1)%a],i=160,p=[];for(let w=0;w<i;w++){let P=w/i,v=O(P),R=l(P);p.push([(v[0]+(R[0]-v[0])*c)*M,(v[1]+(R[1]-v[1])*c)*M])}let m=[],b=0;for(let w=0;w<i;w++){let P=p[w],v=p[(w+1)%i],R=Math.hypot(v[0]-P[0],v[1]-P[1]);m.push(R),b+=R}let h=$t(t.iconD??1),g=(t.rDot??.021)*1.35*M,y=1+.02*Math.sin(u*3.1),f=[],d=n/2,x=0,S=0;for(let w=0;w<h;w++){let P=w/h*b;for(;S+m[x]<P&&x<i-1;)S+=m[x],x++;let v=p[x],R=p[(x+1)%i],k=m[x]?Math.min(1,(P-S)/m[x]):0,D=(v[0]+(R[0]-v[0])*k)*y,C=(v[1]+(R[1]-v[1])*k)*y;f.push({x:d+D*n,y:d+C*n,z:0,r:Math.max(.35,g*n),white:.1})}return q(f,[],t.rMin)},Kt=(n,e,t)=>{let a=n/2,o=n/2,s=n/2*.82,r=j(e*.12,.3,a,o,1),u=$(n,t.rsPow??.6),c=[],M=t.orbitN??12,O=t.ghostN??40,l=t.particles??3;for(let i=0;i<M;i++){let p=_(i,1.7),m=_(i,5.2),b=_(i,8.9),h=s*(.45+.52*p),g=p*2*Math.PI,y=Math.acos(2*m-1),f=Math.sin(y)*Math.cos(g),d=Math.cos(y),x=Math.sin(y)*Math.sin(g),S=-d,w=f,P=0,v=Math.max(1e-6,Math.sqrt(S*S+w*w));S/=v,w/=v;let R=d*P-x*w,k=x*S-f*P,D=f*w-d*S,C=(.25+.55*b)*(b>.5?1:-1);for(let E=0;E<O;E++){let z=E/O*2*Math.PI,[F,N,L]=r((S*Math.cos(z)+R*Math.sin(z))*h,(w*Math.cos(z)+k*Math.sin(z))*h,(P*Math.cos(z)+D*Math.sin(z))*h),B=(L/h+1)/2;c.push({x:F,y:N,z:L,r:(t.ghostR??.9)*u,white:.72,a:(t.ghostA??.5)*(.4+.6*B)})}for(let E=0;E<l;E++){let z=e*C+E/l*2*Math.PI+m*6,[F,N,L]=r((S*Math.cos(z)+R*Math.sin(z))*h,(w*Math.cos(z)+k*Math.sin(z))*h,(P*Math.cos(z)+D*Math.sin(z))*h),B=(L/h+1)/2;c.push({x:F,y:N,z:L,r:((t.partR??1.2)+(t.partRDepth??1.6)*B)*u,white:.3-.22*B})}}return q(c,[],t.rMin)},st=(n,e,t)=>{let a=n/2,o=n/2,s=n/2*.78,r=t.spin??1,u=.3,c=j(e*.1*r,u,a,o,1),M=$(n,t.rsPow??.6),O=[],l=t.ghostN??150;for(let D=0;D<l;D++){let C=J(D,l),[E,z,F]=c(C[0]*s,C[1]*s,C[2]*s),N=(F/s+1)/2;O.push({x:E,y:z,z:F,r:.8*M,white:.78,a:.1+.22*N})}let i=e*.24*r,p=t.faceOn?-u:.55+.3*Math.sin(e*.18)*r,m=Math.cos(i),b=0,h=Math.sin(i),g=-h*Math.sin(p),y=Math.cos(p),f=m*Math.sin(p),d=b*f-h*y,x=h*g-m*f,S=m*y-b*g,w=.23*(t.wobMul??1),P=t.faceOn?s/(1+.85*w):s,v=t.lanes??5,R=t.segs??88,k=Math.max(1,Math.round(v*(t.bandMul??1)));for(let D=0;D<k;D++){let C=(D-(k-1)/2)*.075,E=Math.abs(D-(k-1)/2)/Math.max(1,(k-1)/2);for(let z=0;z<R;z++){let F=z/R*2*Math.PI,N=(.16*Math.sin(F*3-e*1.7+D*.22)+.07*Math.sin(F*5+e*1.1))*(t.wobMul??1),L=t.faceOn?1+N:1,B=t.faceOn?C:C+N,A=m*Math.cos(F)+g*Math.sin(F)+d*B,I=b*Math.cos(F)+y*Math.sin(F)+x*B,T=h*Math.cos(F)+f*Math.sin(F)+S*B,W=Math.sqrt(A*A+I*I+T*T),K=P*L,[wt,Ot,et]=c(A/W*K,I/W*K,T/W*K),G=(et/s+1)/2;O.push({x:wt,y:Ot,z:et,r:((t.rBase??1.1)+(t.rDepth??1.7)*G)*(1-.25*E)*M,white:.52-.44*G+.18*E,a:.4+.6*G})}}return q(O,[],t.rMin)},Yt=(n,e,t)=>{let a=n/2,o=n/2,s=n/2*.8*(t.spread??1),r=j(e*.12,.32,a,o,s),u=$(n,t.rsPow??.6),c=t.nodeN??30,M=t.thr??.72,O=t.nodeR??1.4,l=t.nodeRDepth??1.8,i=[];for(let h=0;h<c;h++){let g=J(h,c),y=g[0]+.3*(V(h*.31+9,e*.24)-.5)*2,f=g[1]+.3*(V(h*.53+27,e*.21)-.5)*2,d=g[2]+.3*(V(h*.77+55,e*.27)-.5)*2,x=Math.sqrt(y*y+f*f+d*d);i.push([y/x,f/x,d/x])}let p=[],m=[];for(let h=0;h<c;h++)for(let g=h+1;g<c;g++){let y=i[h][0]-i[g][0],f=i[h][1]-i[g][1],d=i[h][2]-i[g][2],x=Math.sqrt(y*y+f*f+d*d);if(x>=M)continue;let[S,w,P]=r(i[h][0],i[h][1],i[h][2]),[v,R,k]=r(i[g][0],i[g][1],i[g][2]),D=((P+k)/2+1)/2;p.push({x1:S,y1:w,x2:v,y2:R,white:.42,a:(1-x/M)*(.3+.55*D),w:Math.max(.6,(t.lineW??.8)*u)})}for(let h=0;h<c;h++){let[g,y,f]=r(i[h][0],i[h][1],i[h][2]),d=(f+1)/2,x=1+.25*Math.sin(e*1.4+h*2.7);m.push({x:g,y,z:f,r:(O+l*d)*x*u,white:.55-.45*d})}let b=t.signals??5;for(let h=0;h<b;h++){let g=Math.floor(e*.55+h*7.31),y=Math.floor(_(g,h*3.1+1.7)*c),f=Math.floor(_(g,h*5.7+4.2)*c);if(y===f)continue;let d=at(e*.55+h*7.31),x=U(i[y][0],i[f][0],d),S=U(i[y][1],i[f][1],d),w=U(i[y][2],i[f][2],d),P=Math.max(1e-6,Math.sqrt(x*x+S*S+w*w)),[v,R,k]=r(x/P,S/P,w/P),D=(k+1)/2;m.push({x:v,y:R,z:k,r:(O*1.5+l*D)*u,white:.05,a:.5+.5*D})}return q(m,p,t.rMin)},H={orbits:Kt,globe:Nt,rubik:Bt,wave:Lt,web:Yt,braid:It,ribbon:st,ring:st,morph:Wt},Ht=Object.fromEntries(Object.entries(H).map(([n,e])=>[n,(t,a,o,s,r)=>ht(t,e(a,o,r),s)])),pt={working:\"orbits\",searching:\"globe\",solving:\"rubik\",listening:\"wave\",connecting:\"web\",weaving:\"braid\",composing:\"ribbon\",breathing:\"ring\",shaping:\"morph\"},Gt={orbits:{64:{speed:1.885,count:1,size:1},32:{speed:2.9072,count:.4251,size:1.6849},20:{speed:3.9,count:.238,size:2.4}},globe:{64:{speed:2.015,count:.42,size:1.15,extra:{scanMul:4.08,dimBase:.45}},32:{speed:2.3803,count:.1839,size:1.4769,extra:{scanMul:4.2301,dimBase:.45}},20:{speed:2.665,count:.105,size:1.75,extra:{scanMul:4.335,dimBase:.45}}},rubik:{64:{speed:1.82,count:.35,size:1.05},32:{speed:1.8964,count:.1537,size:1.4951},20:{speed:1.95,count:.088,size:1.9}},wave:{64:{speed:4.388,count:.341,size:1},32:{speed:4.1512,count:.169,size:1.3232},20:{speed:3.998,count:.105,size:1.6}},web:{64:{speed:3.315,count:1.35,size:.95},32:{speed:5.0104,count:.4942,size:1.2571},20:{speed:6.63,count:.25,size:1.52}},braid:{64:{speed:1.625,count:.5,size:1},32:{speed:2.2234,count:.2056,size:1.2011},20:{speed:2.75,count:.1125,size:1.36}},ribbon:{64:{speed:2.34,count:.25,size:.85,extra:{spin:0,bandMul:3.9,wobMul:1}},32:{speed:2.7776,count:.0969,size:.9766,extra:{spin:0,bandMul:4.49,wobMul:1}},20:{speed:3.12,count:.051,size:1.073,extra:{spin:0,bandMul:4.94,wobMul:1}}},ring:{64:{speed:3.24,count:.25,size:.956,extra:{spin:0,bandMul:3.627,wobMul:.368}},32:{speed:3.5517,count:.0678,size:1.31,extra:{spin:0,bandMul:3.8265,wobMul:.4751}},20:{speed:3.78,count:.028,size:1.622,extra:{spin:0,bandMul:3.968,wobMul:.565}}},morph:{64:{speed:2.405,count:.702,size:.395,extra:{spread:1.45}},32:{speed:2.2057,count:.5937,size:.6916,extra:{spread:1.45}},20:{speed:2.08,count:.53,size:1.011,extra:{spread:1.45}}}},ot=new Map;function Z(n,e){let t=`${n}-${e}`,a=ot.get(t);if(a)return a;let o=pt[n],s=Gt[o][e],r={...zt[o]};s.count!==1&&(r=Rt(r,s.count)),s.size!==1&&(r=Dt(r,s.size)),s.extra&&(r={...r,...s.extra});let u={mode:o,speed:s.speed,opts:r};return ot.set(t,u),u}var dt={ribbon:{speed:.55,tilt:.15},nadia:{speed:.55,tilt:.15},sofia:{speed:.55,tilt:-.15},lattice:{speed:.28,tilt:-.12},orbit:{speed:.7,tilt:.2},globe:{speed:.35,tilt:-.16},network:{speed:.55,tilt:.1},braid:{speed:.65,tilt:-.2},morph:{speed:.9,tilt:.12}};function tt(n){return dt[n].speed}function Mt(n,e){return{idle:1,working:1,thinking:1,waiting:0,blocked:0,done:.65}[n]*tt(e)}var Ut=1.6;function ft(n,e){return n!==\"thinking\"&&n!==\"working\"?1:1-.55*((1-Math.cos(e*Math.PI*2/Ut))/2)}function bt(n,e,t){let a=dt[n],o=.82,s=.82,r=0,u=0,c=0,M=0,O=1;if(e===\"idle\"){let l=Math.sin(t*Math.PI/2);o+=l*.01,s+=l*.01,r=-l*.004}else if(e===\"waiting\")o=.8,s=.84,r=-.015,O=.75;else if(e===\"blocked\"){let l=Math.min(1,t/.25),i=Math.sin(l*Math.PI);o=.8+i*.015,s=.82-l*.08,r=l*.025-i*.018,c=a.tilt*l*.4,O=1-l*.4}else if(e===\"done\"){if(t<.18){let l=Math.sin(Math.PI*t/.18);o+=.03*l,s-=.04*l,r=.012*l}else if(t<1.3){let l=(t-.18)/1.12;r=-.07*Math.sin(Math.PI*l),o+=.025*Math.sin(Math.PI*l),s+=.035*Math.sin(Math.PI*l),c=Math.sin(l*Math.PI*2)*.07}}return{sx:o,sy:s,x:u,y:r,rotation:c,split:M,opacity:O}}function nt(n,e,t,a,o,s,r,u=1){if(!(e!==\"working\"&&e!==\"thinking\"&&e!==\"done\")){if(n.save(),e===\"thinking\"){if(r===\"front\")for(let c=0;c<3;c++){let M=o?.5:(1+Math.cos(a*Math.PI*2/3.6-c*Math.PI*2/3))/2,O=s[c%s.length];O!==void 0&&(n.fillStyle=O),n.globalAlpha=(.65+M*.35)*u,n.beginPath(),n.arc(t*(.5+(c-1)*.09),t*.08,Math.max(1,t*(.022+M*.005)),0,Math.PI*2),n.fill()}}else if(e===\"working\"||!o&&a<3.1){let c=e===\"done\"?3:1;for(let M=0;M<c;M++){let O=e===\"done\"?(a-M*.38)/2.2:0;if(O<0||O>1)continue;let l=e===\"done\"?Math.sin(O*Math.PI):1,i=(o?.8:a*Math.PI*2/7.2)+M*2.1,p=Math.PI*1.4,m=-.38+M*.4,b=t*(.44+O*.03),h=t*(.19+O*.11),g=f=>{let d=Math.cos(f)*b,x=Math.sin(f)*h;return[t/2+d*Math.cos(m)-x*Math.sin(m),t/2+d*Math.sin(m)+x*Math.cos(m)]},y=n.createLinearGradient(t*.1,t*.7,t*.9,t*.3);s.forEach((f,d)=>y.addColorStop(d/Math.max(1,s.length-1),f)),n.strokeStyle=y,n.lineCap=\"butt\";for(let f=0;f<100;f++){let d=f/100,x=i-p+p*d,S=Math.sin(x)>=0;if(S!==(r===\"front\"))continue;let w=Math.sin(Math.PI*(.04+d*.92));n.globalAlpha=l*(S?.92:.55)*(.25+w*.75)*u,n.lineWidth=Math.max(.65,t*.027*w),n.beginPath(),n.moveTo(...g(x)),n.lineTo(...g(x+p/100)),n.stroke()}}}n.restore()}}var Vt={orbit:\"working\",globe:\"searching\",lattice:\"solving\",network:\"connecting\",braid:\"weaving\",ribbon:\"composing\",morph:\"shaping\"},Qt={plain:{alpha:1,radius:1},\"over-picture\":{alpha:2.3,radius:1.9}},mt=[\"--nc-identity-azzurro\",\"--nc-identity-verde\",null,\"--nc-identity-rosso\"],yt=[\"--nc-acqua-700\",\"--nc-viola-700\",\"--nc-warning\",\"--nc-rosso-700\"],Xt=[...yt,...mt.filter(n=>n!==null)],Jt=[\"--nc-identity-cobalto\",\"--nc-identity-giallo\",null,\"--nc-identity-arancio\"],Zt={nadia:mt,sofia:Jt};function tn(n,e){let t=1-2*(n+.5)/e,a=Math.sqrt(1-t*t),o=n*Math.PI*(3-Math.sqrt(5));return[a*Math.cos(o),t,a*Math.sin(o)]}function gt(n,e,t){let a=n/2,o=n/2*.78,s=t.spin??1,r=j(e*.1*s,.3,a,a,1),u=$(n,t.rsPow??.6),c=[],M=t.ghostN??150;for(let v=0;v<M;v++){let[R,k,D]=tn(v,M),[C,E,z]=r(R*o,k*o,D*o);c.push({x:C,y:E,z,r:.8*u,white:.78,a:.1+.22*((z/o+1)/2)})}let O=e*.24*s,l=t.faceOn?-.3:.55+.3*Math.sin(e*.18)*s,[i,p,m]=[Math.cos(O),0,Math.sin(O)],[b,h,g]=[-m*Math.sin(l),Math.cos(l),i*Math.sin(l)],[y,f,d]=[p*g-m*h,m*b-i*g,i*h-p*b],x=t.wobMul??1,S=t.faceOn?o/(1+.85*.23*x):o,w=t.segs??88,P=Math.max(1,Math.round((t.lanes??5)*(t.bandMul??1)));for(let v=0;v<P;v++){let R=(v-(P-1)/2)*.075,k=Math.abs(v-(P-1)/2)/Math.max(1,(P-1)/2);for(let D=0;D<w;D++){let C=D/w*2*Math.PI,E=(.16*Math.sin(C*3-e*1.7+v*.22)+.07*Math.sin(C*5+e*1.1))*x,z=t.faceOn?1+E:1,F=t.faceOn?R:R+E,N=i*Math.cos(C)+b*Math.sin(C)+y*F,L=p*Math.cos(C)+h*Math.sin(C)+f*F,B=m*Math.cos(C)+g*Math.sin(C)+d*F,A=Math.sqrt(N*N+L*L+B*B),[I,T,W]=r(N/A*S*z,L/A*S*z,B/A*S*z),K=(W/o+1)/2;c.push({x:I,y:T,z:W,r:((t.rBase??1.1)+(t.rDepth??1.7)*K)*(1-.25*k)*u,white:.08+.1*k,a:.55+.45*K,stripe:Math.min(3,Math.floor(v/P*4))})}}return q(c,[],t.rMin)}function nn(n,e){for(let t of n.dots)t.x=e-t.x;return n}function en(n,e){let{form:t,size:a,seconds:o,color:s,state:r,age:u,reduced:c,breath:M,celebrationColors:O,stripeColors:l}=e,i=Qt[e.presence],p=Z(Vt[t===\"nadia\"||t===\"sofia\"?\"ribbon\":t],a<=32?20:64),m=t===\"nadia\"?gt(a,o,p.opts):t===\"sofia\"?nn(gt(a,o,p.opts),a):H[p.mode](a,o,p.opts);n.clearRect(0,0,a,a);let b=bt(t,e.motion===\"ambient\"?\"idle\":r,c?r===\"done\"?2:.6:u),h=c?.8:u/(r===\"done\"?.575:.2875),g=(d,x)=>{let S=(d-a/2)*b.sx,w=(x-a/2)*b.sy;return[a/2+S*Math.cos(b.rotation)-w*Math.sin(b.rotation)+(b.x+Math.sign(S)*b.split)*a,a/2+S*Math.sin(b.rotation)+w*Math.cos(b.rotation)+b.y*a]},y=b.opacity*M;e.motion===\"status\"&&nt(n,r,a,h,c,O,\"back\",M),n.fillStyle=s,n.strokeStyle=s;for(let d of m.lines)n.globalAlpha=Math.min(1,Math.max(0,(1-d.white)*(d.a??1)*y*i.alpha)),n.lineWidth=d.w*i.radius,n.beginPath(),n.moveTo(...g(d.x1,d.y1)),n.lineTo(...g(d.x2,d.y2)),n.stroke();let f=m.dots;for(let d of f)n.fillStyle=d.stripe===void 0?s:l[d.stripe]??s,n.globalAlpha=Math.min(1,Math.max(0,(1-d.white)*(d.a??1)*y*i.alpha)),n.beginPath(),n.arc(...g(d.x,d.y),d.r*i.radius,0,Math.PI*2),n.fill();n.globalAlpha=1,e.motion===\"status\"&&nt(n,r,a,h,c,O,\"front\",M)}function xt(n,e){let{form:t,presence:a=\"plain\"}=e,o=n.getContext(\"2d\");if(!o)return{destroy(){},setPaused(A){},setState(A){}};let s=window.matchMedia(\"(prefers-reduced-motion: reduce)\"),r=e.paused??!1,u=!0,c=!1,M=0,O=.6,l=0,i=0,p=e.state??\"idle\",m=e.motion??\"status\",b=null,h=0,g=1,y=e.size,f=getComputedStyle(n).color,d=[f],x=[f],S=\"\";function w(){let A=n.getBoundingClientRect(),I=Math.min(A.width,A.height);return I>0?I:e.size}function P(){!o||c||!n.isConnected||(o.setTransform(g,0,0,g,0,0),en(o,{form:t,size:y,seconds:O,color:f,state:p,age:l,reduced:s.matches,breath:s.matches?ft(p,i):1,presence:a,motion:m,celebrationColors:d,stripeColors:x}))}function v(){return c||!n.isConnected||!u||document.hidden||r?!1:s.matches?m===\"status\"&&(p===\"thinking\"||p===\"working\"):m===\"ambient\"?!0:p!==\"waiting\"&&!(p===\"blocked\"&&l>=.3)}function R(A){if(M=0,!!v()){if(b!==null){let I=Math.min((A-b)/1e3,.1);s.matches?i+=I:(O+=I*(m===\"ambient\"?tt(t):Mt(p,t)),m===\"status\"&&(l+=I*(p===\"done\"?.575:.2875)),p===\"done\"&&l>=1.8&&(p=\"idle\",l=0))}b=A,A-h>=1e3/30&&(P(),h=A),M=requestAnimationFrame(R)}}function k(){cancelAnimationFrame(M),M=0,b=null,P(),v()&&(M=requestAnimationFrame(R))}function D(A){let I=document.createElement(\"span\");I.hidden=!0,I.style.color=A,(n.parentElement??document.body).append(I);let T=getComputedStyle(I).color;return I.remove(),T||f}function C(A,I){return[I,window.devicePixelRatio||1,A.color,...Xt.map(T=>A.getPropertyValue(T))].join(\"|\")}function E(){C(getComputedStyle(n),w())!==S&&z()}function z(){if(c||!n.isConnected)return;y=w();let A=Math.max(1,Math.round(y*Math.min(window.devicePixelRatio||1,2)));n.width=A,n.height=A,g=A/y;let I=getComputedStyle(n);S=C(I,y),f=I.color,d=yt.map(T=>D(`color-mix(in oklch, ${I.getPropertyValue(T).trim()||f} 75%, white)`)),x=(Zt[t]??[]).map(T=>T&&I.getPropertyValue(T).trim()||f),k()}let F=new IntersectionObserver(([A])=>{u=A?.isIntersecting??!1,k()});F.observe(n);let N=new MutationObserver(E);for(let A=n;A;A=A.parentElement)N.observe(A,{attributes:!0,attributeFilter:[\"class\",\"style\",\"data-theme\"]});let L=new ResizeObserver(()=>{Math.abs(w()-y)>=.5&&z()});L.observe(n);function B(A){A.propertyName===\"color\"&&A.target instanceof Node&&A.target.contains(n)&&E()}return document.addEventListener(\"transitionend\",B,!0),s.addEventListener(\"change\",k),document.addEventListener(\"visibilitychange\",k),window.addEventListener(\"resize\",E),z(),{setState(A){p=A,l=0,i=0,k()},setPaused(A){r=A,k()},destroy(){c=!0,cancelAnimationFrame(M),F.disconnect(),N.disconnect(),L.disconnect(),document.removeEventListener(\"transitionend\",B,!0),s.removeEventListener(\"change\",k),document.removeEventListener(\"visibilitychange\",k),window.removeEventListener(\"resize\",E)}}}for(let n of document.querySelectorAll(\"canvas[data-agent-orb]\"))xt(n,{form:n.dataset.agentOrb,size:Number(n.dataset.size),state:n.dataset.state??\"idle\"});})();\n";
-export const designTokensCss = "@layer tokens, theme;\n\n\n\n\n\n\n\n\n\n@layer tokens {\n  :root {\n    --nc-action: oklch(0.1776 0.0000 0.00);\n    --nc-action-foreground: oklch(1.0000 0.0000 0.00);\n    --nc-action-hover: oklch(0.3012 0.0000 0.00);\n    --nc-action-active: oklch(0.0000 0.0000 0.00);\n    --nc-ink: oklch(0.1776 0.0000 0.00);\n    --nc-body: oklch(0.5103 0.0000 0.00);\n    --nc-muted: oklch(0.5278 0.0000 0.00);\n    --nc-canvas: oklch(1.0000 0.0000 0.00);\n    --nc-canvas-soft: oklch(0.9851 0.0000 0.00);\n    --nc-canvas-soft-2: oklch(0.9702 0.0000 0.00);\n    --nc-material-workspace: oklch(0.9851 0.0000 0.00);\n    --nc-material-solid: oklch(1.0000 0.0000 0.00);\n    --nc-material-resting: oklch(1.0000 0.0000 0.00);\n    --nc-material-raised: oklch(1.0000 0.0000 0.00);\n    --nc-material-floating: oklch(1.0000 0.0000 0.00);\n    --nc-material-modal: oklch(1.0000 0.0000 0.00);\n    --nc-line: oklch(0.9219 0.0000 0.00);\n    --nc-input: oklch(0.5624 0.0000 0.00);\n    --nc-focus-ring: oklch(0.1776 0.0000 0.00);\n    --nc-scrim: oklch(0.0000 0.0000 0.00);\n    --nc-link: oklch(0.5339 0.1875 256.73);\n    --nc-link-deep: oklch(0.4653 0.1652 257.00);\n    --nc-link-bg-soft: oklch(0.9656 0.0171 248.01);\n    --nc-info: oklch(0.5005 0.2804 266.17);\n    --nc-info-soft: oklch(0.9457 0.0259 276.40);\n    --nc-info-deep: oklch(0.3197 0.1758 266.79);\n    --nc-success: oklch(0.6415 0.1644 153.23);\n    --nc-success-soft: oklch(0.9170 0.0519 161.77);\n    --nc-success-deep: oklch(0.3852 0.0953 154.99);\n    --nc-error: oklch(0.5688 0.1995 26.59);\n    --nc-error-soft: oklch(0.9522 0.0207 17.52);\n    --nc-error-deep: oklch(0.4235 0.1525 27.08);\n    --nc-warning: oklch(0.8466 0.1678 84.63);\n    --nc-warning-soft: oklch(0.9649 0.0461 90.87);\n    --nc-warning-deep: oklch(0.4834 0.0995 82.44);\n    --nc-navigation-selection-bg: oklch(0.9461 0.0000 0.00);\n    --nc-navigation-selection-fg: oklch(0.1776 0.0000 0.00);\n    --nc-navigation-selection-hover: oklch(0.9219 0.0000 0.00);\n    --nc-state-ready: oklch(0.5278 0.0000 0.00);\n    --nc-state-running: oklch(0.5005 0.2804 266.17);\n    --nc-state-review: oklch(0.8466 0.1678 84.63);\n    --nc-state-blocked: oklch(0.5688 0.1995 26.59);\n    --nc-state-complete: oklch(0.6415 0.1644 153.23);\n    --nc-identity-verde: oklch(0.6415 0.1644 153.23);\n    --nc-identity-rosso: oklch(0.5688 0.1995 26.59);\n    --nc-identity-arancio: oklch(0.6824 0.2108 37.70);\n    --nc-identity-giallo: oklch(0.8466 0.1678 84.63);\n    --nc-identity-cobalto: oklch(0.5005 0.2804 266.17);\n    --nc-identity-azzurro: oklch(0.5618 0.2019 258.24);\n    --nc-identity-ink: oklch(0.0000 0.0000 0.00);\n    --nc-identity-white: oklch(1.0000 0.0000 0.00);\n    --nc-logo-dot: oklch(0.5005 0.2804 266.17);\n    --nc-chart-1: oklch(0.5005 0.2804 266.17);\n    --nc-chart-2: oklch(0.6398 0.2044 356.46);\n    --nc-chart-3: oklch(0.5015 0.1883 294.99);\n    --nc-chart-4: oklch(0.6824 0.2108 37.70);\n    --nc-chart-5: oklch(0.6161 0.1062 208.85);\n    --nc-chart-6: oklch(0.5688 0.1995 26.59);\n    --nc-chart-7: oklch(0.7691 0.1577 84.69);\n    --nc-chart-8: oklch(0.6415 0.1644 153.23);\n    --nc-chart-9: oklch(0.7191 0.1452 266.33);\n    --nc-chart-10: oklch(0.8309 0.1048 356.57);\n    --nc-cobalto-100: oklch(0.9754 0.0115 264.51);\n    --nc-cobalto-200: oklch(0.9543 0.0215 265.76);\n    --nc-cobalto-300: oklch(0.9297 0.0334 265.23);\n    --nc-cobalto-400: oklch(0.8944 0.0509 267.00);\n    --nc-cobalto-500: oklch(0.8308 0.0837 265.90);\n    --nc-cobalto-600: oklch(0.7191 0.1452 266.33);\n    --nc-cobalto-700: oklch(0.5005 0.2804 266.17);\n    --nc-cobalto-800: oklch(0.4602 0.2797 266.14);\n    --nc-cobalto-900: oklch(0.4202 0.2522 266.14);\n    --nc-cobalto-1000: oklch(0.2811 0.1684 266.17);\n    --nc-rosso-100: oklch(0.9752 0.0122 29.87);\n    --nc-rosso-200: oklch(0.9552 0.0222 27.81);\n    --nc-rosso-300: oklch(0.9290 0.0360 26.28);\n    --nc-rosso-400: oklch(0.8944 0.0552 26.52);\n    --nc-rosso-500: oklch(0.8304 0.0942 26.48);\n    --nc-rosso-600: oklch(0.7201 0.1742 26.79);\n    --nc-rosso-700: oklch(0.5688 0.1995 26.59);\n    --nc-rosso-800: oklch(0.5297 0.1996 26.67);\n    --nc-rosso-900: oklch(0.4882 0.1797 26.59);\n    --nc-rosso-1000: oklch(0.2805 0.1143 26.81);\n    --nc-arancio-100: oklch(0.9749 0.0125 35.73);\n    --nc-arancio-200: oklch(0.9544 0.0233 37.38);\n    --nc-arancio-300: oklch(0.9298 0.0366 36.77);\n    --nc-arancio-400: oklch(0.8945 0.0567 37.21);\n    --nc-arancio-500: oklch(0.8292 0.0974 37.12);\n    --nc-arancio-600: oklch(0.7428 0.1602 37.76);\n    --nc-arancio-700: oklch(0.6824 0.2108 37.70);\n    --nc-arancio-800: oklch(0.6419 0.2102 37.75);\n    --nc-arancio-900: oklch(0.4993 0.1647 37.64);\n    --nc-arancio-1000: oklch(0.2801 0.0916 38.02);\n    --nc-giallo-100: oklch(0.9860 0.0154 86.42);\n    --nc-giallo-200: oklch(0.9699 0.0272 83.54);\n    --nc-giallo-300: oklch(0.9555 0.0420 85.96);\n    --nc-giallo-400: oklch(0.9298 0.0673 84.45);\n    --nc-giallo-500: oklch(0.9004 0.1074 84.93);\n    --nc-giallo-600: oklch(0.8696 0.1403 84.42);\n    --nc-giallo-700: oklch(0.8466 0.1678 84.63);\n    --nc-giallo-800: oklch(0.7691 0.1577 84.69);\n    --nc-giallo-900: oklch(0.5305 0.1090 83.33);\n    --nc-giallo-1000: oklch(0.3186 0.0654 84.14);\n    --nc-verde-100: oklch(0.9747 0.0157 154.48);\n    --nc-verde-200: oklch(0.9560 0.0265 152.38);\n    --nc-verde-300: oklch(0.9290 0.0407 153.11);\n    --nc-verde-400: oklch(0.8955 0.0664 152.93);\n    --nc-verde-500: oklch(0.8310 0.1403 153.27);\n    --nc-verde-600: oklch(0.7191 0.1645 153.16);\n    --nc-verde-700: oklch(0.6415 0.1644 153.23);\n    --nc-verde-800: oklch(0.6017 0.1542 153.23);\n    --nc-verde-900: oklch(0.4992 0.1279 153.23);\n    --nc-verde-1000: oklch(0.2815 0.0723 153.13);\n    --nc-acqua-100: oklch(0.9752 0.0109 211.04);\n    --nc-acqua-200: oklch(0.9559 0.0171 205.84);\n    --nc-acqua-300: oklch(0.9297 0.0259 208.75);\n    --nc-acqua-400: oklch(0.8954 0.0424 207.56);\n    --nc-acqua-500: oklch(0.8304 0.0902 209.06);\n    --nc-acqua-600: oklch(0.7205 0.1064 208.54);\n    --nc-acqua-700: oklch(0.6161 0.1062 208.85);\n    --nc-acqua-800: oklch(0.5765 0.0992 208.28);\n    --nc-acqua-900: oklch(0.4990 0.0860 208.78);\n    --nc-acqua-1000: oklch(0.2797 0.0484 210.29);\n    --nc-viola-100: oklch(0.9745 0.0134 295.33);\n    --nc-viola-200: oklch(0.9545 0.0243 296.12);\n    --nc-viola-300: oklch(0.9290 0.0381 295.47);\n    --nc-viola-400: oklch(0.8954 0.0563 294.18);\n    --nc-viola-500: oklch(0.8289 0.0954 295.03);\n    --nc-viola-600: oklch(0.7204 0.1631 294.91);\n    --nc-viola-700: oklch(0.5015 0.1883 294.99);\n    --nc-viola-800: oklch(0.4620 0.1886 294.84);\n    --nc-viola-900: oklch(0.4227 0.1694 295.05);\n    --nc-viola-1000: oklch(0.2796 0.1131 295.14);\n    --nc-rosa-100: oklch(0.9746 0.0139 355.00);\n    --nc-rosa-200: oklch(0.9555 0.0241 358.28);\n    --nc-rosa-300: oklch(0.9307 0.0386 357.63);\n    --nc-rosa-400: oklch(0.8944 0.0614 356.49);\n    --nc-rosa-500: oklch(0.8309 0.1048 356.57);\n    --nc-rosa-600: oklch(0.7193 0.1969 356.59);\n    --nc-rosa-700: oklch(0.6398 0.2044 356.46);\n    --nc-rosa-800: oklch(0.6001 0.2050 356.50);\n    --nc-rosa-900: oklch(0.5009 0.1842 356.43);\n    --nc-rosa-1000: oklch(0.2808 0.1147 356.80);\n    --nc-dark-canvas: oklch(0.0000 0.0000 0.00);\n    --nc-dark-canvas-soft: oklch(0.1776 0.0000 0.00);\n    --nc-dark-canvas-soft-2: oklch(0.2178 0.0000 0.00);\n    --nc-dark-material-workspace: oklch(0.0000 0.0000 0.00);\n    --nc-dark-material-solid: oklch(0.0000 0.0000 0.00);\n    --nc-dark-material-resting: oklch(0.1448 0.0000 0.00);\n    --nc-dark-material-raised: oklch(0.1684 0.0000 0.00);\n    --nc-dark-material-floating: oklch(0.1776 0.0000 0.00);\n    --nc-dark-material-modal: oklch(0.1776 0.0000 0.00);\n    --nc-dark-ink: oklch(0.9461 0.0000 0.00);\n    --nc-dark-body: oklch(0.7090 0.0000 0.00);\n    --nc-dark-muted: oklch(0.6993 0.0000 0.00);\n    --nc-dark-line: oklch(0.2686 0.0000 0.00);\n    --nc-dark-input: oklch(0.5590 0.0000 0.00);\n    --nc-dark-on-primary: oklch(0.1448 0.0000 0.00);\n    --nc-dark-action: oklch(0.9461 0.0000 0.00);\n    --nc-dark-action-foreground: oklch(0.1448 0.0000 0.00);\n    --nc-dark-action-hover: oklch(0.8761 0.0000 0.00);\n    --nc-dark-action-active: oklch(0.8297 0.0000 0.00);\n    --nc-dark-link: oklch(0.7173 0.1522 251.00);\n    --nc-dark-link-deep: oklch(0.8135 0.0986 247.81);\n    --nc-dark-link-bg-soft: oklch(0.2518 0.0572 257.41);\n    --nc-dark-focus-ring: oklch(0.9461 0.0000 0.00);\n    --nc-dark-scrim: oklch(0.0000 0.0000 0.00);\n    --nc-dark-error: oklch(0.7955 0.0980 21.02);\n    --nc-dark-error-soft: oklch(0.2296 0.0728 26.06);\n    --nc-dark-error-deep: oklch(0.8856 0.0534 19.64);\n    --nc-dark-warning: oklch(0.8939 0.1387 90.47);\n    --nc-dark-warning-soft: oklch(0.3135 0.0643 85.04);\n    --nc-dark-warning-deep: oklch(0.9320 0.0896 90.86);\n    --nc-dark-info: oklch(0.7067 0.1528 272.08);\n    --nc-dark-info-soft: oklch(0.2118 0.1033 268.28);\n    --nc-dark-info-deep: oklch(0.8222 0.0888 274.44);\n    --nc-dark-success: oklch(0.7019 0.1753 153.20);\n    --nc-dark-success-soft: oklch(0.2893 0.0697 156.32);\n    --nc-dark-success-deep: oklch(0.8524 0.0996 159.83);\n    --nc-dark-state-ready: oklch(0.5624 0.0000 0.00);\n    --nc-dark-state-running: oklch(0.5923 0.2215 269.61);\n    --nc-dark-state-review: oklch(0.8466 0.1678 84.63);\n    --nc-dark-state-blocked: oklch(0.5688 0.1995 26.59);\n    --nc-dark-state-complete: oklch(0.6415 0.1644 153.23);\n    --nc-dark-logo-dot: oklch(0.5923 0.2215 269.61);\n    --nc-dark-navigation-selection-bg: oklch(0.2393 0.0000 0.00);\n    --nc-dark-navigation-selection-fg: oklch(0.9461 0.0000 0.00);\n    --nc-dark-navigation-selection-hover: oklch(0.2686 0.0000 0.00);\n    --nc-dark-chart-1: oklch(0.6007 0.2160 266.02);\n    --nc-dark-chart-2: oklch(0.6611 0.1941 356.61);\n    --nc-dark-chart-3: oklch(0.6004 0.1789 294.79);\n    --nc-dark-chart-4: oklch(0.6612 0.2003 37.74);\n    --nc-dark-chart-5: oklch(0.6568 0.1009 208.69);\n    --nc-dark-chart-6: oklch(0.6084 0.1887 26.65);\n    --nc-dark-chart-7: oklch(0.8466 0.1678 84.63);\n    --nc-dark-chart-8: oklch(0.6608 0.1568 153.03);\n    --nc-dark-chart-9: oklch(0.7993 0.1005 266.67);\n    --nc-dark-chart-10: oklch(0.8005 0.1279 356.32);\n    --nc-dark-cobalto-100: oklch(0.1915 0.0982 266.32);\n    --nc-dark-cobalto-200: oklch(0.2197 0.1184 266.25);\n    --nc-dark-cobalto-300: oklch(0.2604 0.1398 265.97);\n    --nc-dark-cobalto-400: oklch(0.2997 0.1624 266.24);\n    --nc-dark-cobalto-500: oklch(0.3702 0.1966 266.08);\n    --nc-dark-cobalto-600: oklch(0.6007 0.2160 266.02);\n    --nc-dark-cobalto-700: oklch(0.5005 0.2804 266.17);\n    --nc-dark-cobalto-800: oklch(0.4602 0.2797 266.14);\n    --nc-dark-cobalto-900: oklch(0.7993 0.1005 266.67);\n    --nc-dark-cobalto-1000: oklch(0.9604 0.0186 265.98);\n    --nc-dark-rosso-100: oklch(0.1907 0.0689 26.80);\n    --nc-dark-rosso-200: oklch(0.2215 0.0837 26.41);\n    --nc-dark-rosso-300: oklch(0.2596 0.0994 26.37);\n    --nc-dark-rosso-400: oklch(0.3014 0.1159 26.97);\n    --nc-dark-rosso-500: oklch(0.3705 0.1397 26.54);\n    --nc-dark-rosso-600: oklch(0.6084 0.1887 26.65);\n    --nc-dark-rosso-700: oklch(0.5688 0.1995 26.59);\n    --nc-dark-rosso-800: oklch(0.5297 0.1996 26.67);\n    --nc-dark-rosso-900: oklch(0.7992 0.1149 26.43);\n    --nc-dark-rosso-1000: oklch(0.9598 0.0198 25.17);\n    --nc-dark-arancio-100: oklch(0.1909 0.0632 37.47);\n    --nc-dark-arancio-200: oklch(0.2201 0.0732 37.26);\n    --nc-dark-arancio-300: oklch(0.2598 0.0852 37.90);\n    --nc-dark-arancio-400: oklch(0.2988 0.0989 37.50);\n    --nc-dark-arancio-500: oklch(0.3706 0.1219 37.77);\n    --nc-dark-arancio-600: oklch(0.6612 0.2003 37.74);\n    --nc-dark-arancio-700: oklch(0.6824 0.2108 37.70);\n    --nc-dark-arancio-800: oklch(0.6419 0.2102 37.75);\n    --nc-dark-arancio-900: oklch(0.7993 0.1180 37.52);\n    --nc-dark-arancio-1000: oklch(0.9590 0.0208 36.03);\n    --nc-dark-giallo-100: oklch(0.1903 0.0391 84.07);\n    --nc-dark-giallo-200: oklch(0.2185 0.0449 83.81);\n    --nc-dark-giallo-300: oklch(0.2592 0.0532 83.54);\n    --nc-dark-giallo-400: oklch(0.3008 0.0616 85.18);\n    --nc-dark-giallo-500: oklch(0.3705 0.0759 85.25);\n    --nc-dark-giallo-600: oklch(0.6598 0.1353 84.83);\n    --nc-dark-giallo-700: oklch(0.8466 0.1678 84.63);\n    --nc-dark-giallo-800: oklch(0.8064 0.1654 84.43);\n    --nc-dark-giallo-900: oklch(0.8007 0.1595 84.74);\n    --nc-dark-giallo-1000: oklch(0.9604 0.0256 84.59);\n    --nc-dark-verde-100: oklch(0.1910 0.0488 153.39);\n    --nc-dark-verde-200: oklch(0.2208 0.0571 152.80);\n    --nc-dark-verde-300: oklch(0.2606 0.0664 153.49);\n    --nc-dark-verde-400: oklch(0.2987 0.0765 153.24);\n    --nc-dark-verde-500: oklch(0.3685 0.0944 153.24);\n    --nc-dark-verde-600: oklch(0.6608 0.1568 153.03);\n    --nc-dark-verde-700: oklch(0.6415 0.1644 153.23);\n    --nc-dark-verde-800: oklch(0.6017 0.1542 153.23);\n    --nc-dark-verde-900: oklch(0.7994 0.1555 153.29);\n    --nc-dark-verde-1000: oklch(0.9600 0.0248 152.88);\n    --nc-dark-acqua-100: oklch(0.1914 0.0330 209.05);\n    --nc-dark-acqua-200: oklch(0.2192 0.0379 209.81);\n    --nc-dark-acqua-300: oklch(0.2610 0.0450 209.30);\n    --nc-dark-acqua-400: oklch(0.3011 0.0519 208.95);\n    --nc-dark-acqua-500: oklch(0.3711 0.0639 208.82);\n    --nc-dark-acqua-600: oklch(0.6568 0.1009 208.69);\n    --nc-dark-acqua-700: oklch(0.6161 0.1062 208.85);\n    --nc-dark-acqua-800: oklch(0.5765 0.0992 208.28);\n    --nc-dark-acqua-900: oklch(0.8004 0.1007 208.37);\n    --nc-dark-acqua-1000: oklch(0.9596 0.0161 206.44);\n    --nc-dark-viola-100: oklch(0.1897 0.0654 295.79);\n    --nc-dark-viola-200: oklch(0.2192 0.0805 294.49);\n    --nc-dark-viola-300: oklch(0.2605 0.0949 295.18);\n    --nc-dark-viola-400: oklch(0.2990 0.1087 294.76);\n    --nc-dark-viola-500: oklch(0.3702 0.1310 295.14);\n    --nc-dark-viola-600: oklch(0.6004 0.1789 294.79);\n    --nc-dark-viola-700: oklch(0.5015 0.1883 294.99);\n    --nc-dark-viola-800: oklch(0.4620 0.1886 294.84);\n    --nc-dark-viola-900: oklch(0.8000 0.1131 295.20);\n    --nc-dark-viola-1000: oklch(0.9591 0.0215 294.60);\n    --nc-dark-rosa-100: oklch(0.1902 0.0716 355.67);\n    --nc-dark-rosa-200: oklch(0.2198 0.0850 357.06);\n    --nc-dark-rosa-300: oklch(0.2591 0.1026 356.37);\n    --nc-dark-rosa-400: oklch(0.3000 0.1188 356.62);\n    --nc-dark-rosa-500: oklch(0.3695 0.1426 356.71);\n    --nc-dark-rosa-600: oklch(0.6611 0.1941 356.61);\n    --nc-dark-rosa-700: oklch(0.6398 0.2044 356.46);\n    --nc-dark-rosa-800: oklch(0.6001 0.2050 356.50);\n    --nc-dark-rosa-900: oklch(0.8005 0.1279 356.32);\n    --nc-dark-rosa-1000: oklch(0.9599 0.0220 356.32);\n    --nc-category-teal-soft: oklch(0.9585 0.0244 187.32);\n    --nc-category-teal-deep: oklch(0.4600 0.0788 185.34);\n    --nc-dark-category-teal-soft: oklch(0.2627 0.0410 187.13);\n    --nc-dark-category-teal-deep: oklch(0.8398 0.1008 186.70);\n    --nc-category-purple-soft: oklch(0.9464 0.0327 307.17);\n    --nc-category-purple-deep: oklch(0.4541 0.1958 308.26);\n    --nc-dark-category-purple-soft: oklch(0.2479 0.0790 306.78);\n    --nc-dark-category-purple-deep: oklch(0.7911 0.1271 310.92);\n    --nc-category-pink-soft: oklch(0.9476 0.0263 347.12);\n    --nc-category-pink-deep: oklch(0.4863 0.1711 355.09);\n    --nc-dark-category-pink-soft: oklch(0.2550 0.0598 353.51);\n    --nc-dark-category-pink-deep: oklch(0.8108 0.1129 347.21);\n    --nc-xxs: 4px;\n    --nc-xs: 8px;\n    --nc-sm: 12px;\n    --nc-md: 16px;\n    --nc-lg: 24px;\n    --nc-xl: 32px;\n    --nc-2xl: 40px;\n    --nc-3xl: 48px;\n    --nc-4xl: 64px;\n    --nc-5xl: 96px;\n    --nc-6xl: 128px;\n    --nc-guide: 1px;\n    --nc-icon-stroke: 1.5px;\n    --nc-icon-stroke-sm: 1.25px;\n    --nc-focus-outline-width: 2px;\n    --nc-focus-outline-offset: 2px;\n    --nc-control-height: 36px;\n    --nc-control-height-sm: 32px;\n    --nc-control-height-lg: 40px;\n    --nc-control-height-xs: 24px;\n    --nc-control-padding-inline: 12px;\n    --nc-card-padding: 20px;\n    --nc-touch-target: 44px;\n    --nc-rounded-none: 0px;\n    --nc-rounded-xs: 2px;\n    --nc-rounded-sm: 6px;\n    --nc-rounded-md: 8px;\n    --nc-rounded-lg: 12px;\n    --nc-rounded-xl: 16px;\n    --nc-rounded-2xl: 20px;\n    --nc-rounded-3xl: 24px;\n    --nc-rounded-full: 9999px;\n    --nc-type-display-xl-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-display-xl-font-size: 72px;\n    --nc-type-display-xl-font-weight: 600;\n    --nc-type-display-xl-line-height: 72px;\n    --nc-type-display-xl-letter-spacing: -4.32px;\n    --nc-type-display-wide-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-display-wide-font-size: 64px;\n    --nc-type-display-wide-font-weight: 600;\n    --nc-type-display-wide-line-height: 64px;\n    --nc-type-display-wide-letter-spacing: -3.84px;\n    --nc-type-display-lg-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-display-lg-font-size: 56px;\n    --nc-type-display-lg-font-weight: 600;\n    --nc-type-display-lg-line-height: 56px;\n    --nc-type-display-lg-letter-spacing: -3.36px;\n    --nc-type-display-section-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-display-section-font-size: 48px;\n    --nc-type-display-section-font-weight: 600;\n    --nc-type-display-section-line-height: 56px;\n    --nc-type-display-section-letter-spacing: -2.88px;\n    --nc-type-display-md-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-display-md-font-size: 40px;\n    --nc-type-display-md-font-weight: 600;\n    --nc-type-display-md-line-height: 48px;\n    --nc-type-display-md-letter-spacing: -2.4px;\n    --nc-type-heading-lg-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-heading-lg-font-size: 32px;\n    --nc-type-heading-lg-font-weight: 600;\n    --nc-type-heading-lg-line-height: 40px;\n    --nc-type-heading-lg-letter-spacing: -1.28px;\n    --nc-type-heading-md-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-heading-md-font-size: 24px;\n    --nc-type-heading-md-font-weight: 600;\n    --nc-type-heading-md-line-height: 32px;\n    --nc-type-heading-md-letter-spacing: -0.96px;\n    --nc-type-heading-sm-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-heading-sm-font-size: 20px;\n    --nc-type-heading-sm-font-weight: 600;\n    --nc-type-heading-sm-line-height: 26px;\n    --nc-type-heading-sm-letter-spacing: -0.4px;\n    --nc-type-heading-xs-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-heading-xs-font-size: 16px;\n    --nc-type-heading-xs-font-weight: 600;\n    --nc-type-heading-xs-line-height: 24px;\n    --nc-type-heading-xs-letter-spacing: -0.32px;\n    --nc-type-heading-compact-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-heading-compact-font-size: 14px;\n    --nc-type-heading-compact-font-weight: 600;\n    --nc-type-heading-compact-line-height: 20px;\n    --nc-type-heading-compact-letter-spacing: -0.28px;\n    --nc-type-button-lg-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-button-lg-font-size: 16px;\n    --nc-type-button-lg-font-weight: 500;\n    --nc-type-button-lg-line-height: 20px;\n    --nc-type-button-lg-letter-spacing: 0px;\n    --nc-type-button-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-button-font-size: 14px;\n    --nc-type-button-font-weight: 500;\n    --nc-type-button-line-height: 20px;\n    --nc-type-button-letter-spacing: 0px;\n    --nc-type-button-xs-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-button-xs-font-size: 12px;\n    --nc-type-button-xs-font-weight: 500;\n    --nc-type-button-xs-line-height: 16px;\n    --nc-type-button-xs-letter-spacing: 0px;\n    --nc-type-label-display-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-label-display-font-size: 20px;\n    --nc-type-label-display-font-weight: 400;\n    --nc-type-label-display-line-height: 32px;\n    --nc-type-label-display-letter-spacing: 0px;\n    --nc-type-label-lg-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-label-lg-font-size: 18px;\n    --nc-type-label-lg-font-weight: 400;\n    --nc-type-label-lg-line-height: 20px;\n    --nc-type-label-lg-letter-spacing: 0px;\n    --nc-type-label-md-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-label-md-font-size: 16px;\n    --nc-type-label-md-font-weight: 400;\n    --nc-type-label-md-line-height: 20px;\n    --nc-type-label-md-letter-spacing: 0px;\n    --nc-type-label-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-label-font-size: 14px;\n    --nc-type-label-font-weight: 400;\n    --nc-type-label-line-height: 20px;\n    --nc-type-label-letter-spacing: 0px;\n    --nc-type-label-sm-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-label-sm-font-size: 13px;\n    --nc-type-label-sm-font-weight: 400;\n    --nc-type-label-sm-line-height: 16px;\n    --nc-type-label-sm-letter-spacing: 0px;\n    --nc-type-caption-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-caption-font-size: 12px;\n    --nc-type-caption-font-weight: 400;\n    --nc-type-caption-line-height: 16px;\n    --nc-type-caption-letter-spacing: 0px;\n    --nc-type-label-mono-lg-font-family:\n      Geist Mono,\n      ui-monospace,\n      SFMono-Regular,\n      Menlo,\n      Monaco,\n      monospace;\n    --nc-type-label-mono-lg-font-size: 14px;\n    --nc-type-label-mono-lg-font-weight: 400;\n    --nc-type-label-mono-lg-line-height: 20px;\n    --nc-type-label-mono-lg-letter-spacing: 0px;\n    --nc-type-label-mono-md-font-family:\n      Geist Mono,\n      ui-monospace,\n      SFMono-Regular,\n      Menlo,\n      Monaco,\n      monospace;\n    --nc-type-label-mono-md-font-size: 13px;\n    --nc-type-label-mono-md-font-weight: 400;\n    --nc-type-label-mono-md-line-height: 20px;\n    --nc-type-label-mono-md-letter-spacing: 0px;\n    --nc-type-label-mono-font-family:\n      Geist Mono,\n      ui-monospace,\n      SFMono-Regular,\n      Menlo,\n      Monaco,\n      monospace;\n    --nc-type-label-mono-font-size: 12px;\n    --nc-type-label-mono-font-weight: 400;\n    --nc-type-label-mono-line-height: 16px;\n    --nc-type-label-mono-letter-spacing: 0px;\n    --nc-type-body-display-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-body-display-font-size: 24px;\n    --nc-type-body-display-font-weight: 400;\n    --nc-type-body-display-line-height: 36px;\n    --nc-type-body-display-letter-spacing: 0px;\n    --nc-type-body-lead-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-body-lead-font-size: 20px;\n    --nc-type-body-lead-font-weight: 400;\n    --nc-type-body-lead-line-height: 36px;\n    --nc-type-body-lead-letter-spacing: 0px;\n    --nc-type-body-lg-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-body-lg-font-size: 18px;\n    --nc-type-body-lg-font-weight: 400;\n    --nc-type-body-lg-line-height: 28px;\n    --nc-type-body-lg-letter-spacing: 0px;\n    --nc-type-body-md-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-body-md-font-size: 16px;\n    --nc-type-body-md-font-weight: 400;\n    --nc-type-body-md-line-height: 24px;\n    --nc-type-body-md-letter-spacing: 0px;\n    --nc-type-body-sm-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-body-sm-font-size: 14px;\n    --nc-type-body-sm-font-weight: 400;\n    --nc-type-body-sm-line-height: 20px;\n    --nc-type-body-sm-letter-spacing: 0px;\n    --nc-type-body-compact-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-body-compact-font-size: 13px;\n    --nc-type-body-compact-font-weight: 400;\n    --nc-type-body-compact-line-height: 18px;\n    --nc-type-body-compact-letter-spacing: 0px;\n    --nc-type-code-font-family:\n      Geist Mono,\n      ui-monospace,\n      SFMono-Regular,\n      Menlo,\n      Monaco,\n      monospace;\n    --nc-type-code-font-size: 13px;\n    --nc-type-code-font-weight: 400;\n    --nc-type-code-line-height: 18px;\n    --nc-type-code-letter-spacing: 0px;\n    --nc-material-scrim-opacity: 50%;\n    --nc-material-glass-opacity: 60%;\n    --nc-material-glass-saturation: 180%;\n    --nc-material-glass-blur: 20px;\n    --nc-material-glass-highlight: inset 0px 1px 0px 0px rgb(100% 100% 100% / 0.18);\n    --nc-elevation-resting:\n      0px 0px 0px 1px rgb(0% 0% 0% / 0.08),\n      0px 2px 2px 0px rgb(0% 0% 0% / 0.04),\n      0px 0px 0px 1px rgb(100% 100% 100%);\n    --nc-elevation-raised:\n      0px 0px 0px 1px rgb(0% 0% 0% / 0.08),\n      0px 2px 2px 0px rgb(0% 0% 0% / 0.04),\n      0px 8px 8px -8px rgb(0% 0% 0% / 0.04),\n      0px 0px 0px 1px rgb(100% 100% 100%);\n    --nc-elevation-floating:\n      0px 0px 0px 1px rgb(0% 0% 0% / 0.08),\n      0px 1px 1px 0px rgb(0% 0% 0% / 0.02),\n      0px 4px 8px -4px rgb(0% 0% 0% / 0.04),\n      0px 16px 24px -8px rgb(0% 0% 0% / 0.06),\n      0px 0px 0px 1px rgb(100% 100% 100%);\n    --nc-elevation-modal:\n      0px 0px 0px 1px rgb(0% 0% 0% / 0.08),\n      0px 1px 1px 0px rgb(0% 0% 0% / 0.02),\n      0px 8px 16px -4px rgb(0% 0% 0% / 0.04),\n      0px 24px 32px -8px rgb(0% 0% 0% / 0.06),\n      0px 0px 0px 1px rgb(100% 100% 100%);\n    --nc-duration-control: 100ms;\n    --nc-duration-close: 140ms;\n    --nc-duration-confirm: 180ms;\n    --nc-duration-open: 220ms;\n    --nc-duration-msg-in: 240ms;\n    --nc-duration-transition: 240ms;\n    --nc-duration-arrive: 300ms;\n    --nc-duration-drawer-swipe: 400ms;\n    --nc-duration-drawer: 450ms;\n    --nc-duration-wait: 1.6s;\n    --nc-ease-emphasized: cubic-bezier(0.3, 0.7, 0.2, 1);\n    --nc-ease-out-strong: cubic-bezier(0.23, 1, 0.32, 1);\n    --nc-ease-in-out-strong: cubic-bezier(0.77, 0, 0.175, 1);\n    --nc-ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);\n    --nc-content-max: 1200px;\n    --nc-gutter-mobile: 20px;\n    --nc-gutter-tablet: 40px;\n    --nc-gutter-desktop: 64px;\n    --nc-section-step-mobile: 64px;\n    --nc-section-step-desktop: 96px;\n  }\n}\n\n\n@layer theme {\n  .dark {\n    --nc-canvas: var(--nc-dark-canvas);\n    --nc-canvas-soft: var(--nc-dark-canvas-soft);\n    --nc-canvas-soft-2: var(--nc-dark-canvas-soft-2);\n    --nc-material-workspace: var(--nc-dark-material-workspace);\n    --nc-material-solid: var(--nc-dark-material-solid);\n    --nc-material-resting: var(--nc-dark-material-resting);\n    --nc-material-raised: var(--nc-dark-material-raised);\n    --nc-material-floating: var(--nc-dark-material-floating);\n    --nc-material-modal: var(--nc-dark-material-modal);\n    --nc-ink: var(--nc-dark-ink);\n    --nc-body: var(--nc-dark-body);\n    --nc-muted: var(--nc-dark-muted);\n    --nc-line: var(--nc-dark-line);\n    --nc-input: var(--nc-dark-input);\n    --nc-action: var(--nc-dark-action);\n    --nc-action-foreground: var(--nc-dark-action-foreground);\n    --nc-action-hover: var(--nc-dark-action-hover);\n    --nc-action-active: var(--nc-dark-action-active);\n    --nc-link: var(--nc-dark-link);\n    --nc-link-deep: var(--nc-dark-link-deep);\n    --nc-link-bg-soft: var(--nc-dark-link-bg-soft);\n    --nc-focus-ring: var(--nc-dark-focus-ring);\n    --nc-scrim: var(--nc-dark-scrim);\n    --nc-error: var(--nc-dark-error);\n    --nc-error-soft: var(--nc-dark-error-soft);\n    --nc-error-deep: var(--nc-dark-error-deep);\n    --nc-warning: var(--nc-dark-warning);\n    --nc-warning-soft: var(--nc-dark-warning-soft);\n    --nc-warning-deep: var(--nc-dark-warning-deep);\n    --nc-info: var(--nc-dark-info);\n    --nc-info-soft: var(--nc-dark-info-soft);\n    --nc-info-deep: var(--nc-dark-info-deep);\n    --nc-success: var(--nc-dark-success);\n    --nc-success-soft: var(--nc-dark-success-soft);\n    --nc-success-deep: var(--nc-dark-success-deep);\n    --nc-state-ready: var(--nc-dark-state-ready);\n    --nc-state-running: var(--nc-dark-state-running);\n    --nc-state-review: var(--nc-dark-state-review);\n    --nc-state-blocked: var(--nc-dark-state-blocked);\n    --nc-state-complete: var(--nc-dark-state-complete);\n    --nc-logo-dot: var(--nc-dark-logo-dot);\n    --nc-navigation-selection-bg: var(--nc-dark-navigation-selection-bg);\n    --nc-navigation-selection-fg: var(--nc-dark-navigation-selection-fg);\n    --nc-navigation-selection-hover: var(--nc-dark-navigation-selection-hover);\n    --nc-chart-1: var(--nc-dark-chart-1);\n    --nc-chart-2: var(--nc-dark-chart-2);\n    --nc-chart-3: var(--nc-dark-chart-3);\n    --nc-chart-4: var(--nc-dark-chart-4);\n    --nc-chart-5: var(--nc-dark-chart-5);\n    --nc-chart-6: var(--nc-dark-chart-6);\n    --nc-chart-7: var(--nc-dark-chart-7);\n    --nc-chart-8: var(--nc-dark-chart-8);\n    --nc-chart-9: var(--nc-dark-chart-9);\n    --nc-chart-10: var(--nc-dark-chart-10);\n    --nc-cobalto-100: var(--nc-dark-cobalto-100);\n    --nc-cobalto-200: var(--nc-dark-cobalto-200);\n    --nc-cobalto-300: var(--nc-dark-cobalto-300);\n    --nc-cobalto-400: var(--nc-dark-cobalto-400);\n    --nc-cobalto-500: var(--nc-dark-cobalto-500);\n    --nc-cobalto-600: var(--nc-dark-cobalto-600);\n    --nc-cobalto-700: var(--nc-dark-cobalto-700);\n    --nc-cobalto-800: var(--nc-dark-cobalto-800);\n    --nc-cobalto-900: var(--nc-dark-cobalto-900);\n    --nc-cobalto-1000: var(--nc-dark-cobalto-1000);\n    --nc-rosso-100: var(--nc-dark-rosso-100);\n    --nc-rosso-200: var(--nc-dark-rosso-200);\n    --nc-rosso-300: var(--nc-dark-rosso-300);\n    --nc-rosso-400: var(--nc-dark-rosso-400);\n    --nc-rosso-500: var(--nc-dark-rosso-500);\n    --nc-rosso-600: var(--nc-dark-rosso-600);\n    --nc-rosso-700: var(--nc-dark-rosso-700);\n    --nc-rosso-800: var(--nc-dark-rosso-800);\n    --nc-rosso-900: var(--nc-dark-rosso-900);\n    --nc-rosso-1000: var(--nc-dark-rosso-1000);\n    --nc-arancio-100: var(--nc-dark-arancio-100);\n    --nc-arancio-200: var(--nc-dark-arancio-200);\n    --nc-arancio-300: var(--nc-dark-arancio-300);\n    --nc-arancio-400: var(--nc-dark-arancio-400);\n    --nc-arancio-500: var(--nc-dark-arancio-500);\n    --nc-arancio-600: var(--nc-dark-arancio-600);\n    --nc-arancio-700: var(--nc-dark-arancio-700);\n    --nc-arancio-800: var(--nc-dark-arancio-800);\n    --nc-arancio-900: var(--nc-dark-arancio-900);\n    --nc-arancio-1000: var(--nc-dark-arancio-1000);\n    --nc-giallo-100: var(--nc-dark-giallo-100);\n    --nc-giallo-200: var(--nc-dark-giallo-200);\n    --nc-giallo-300: var(--nc-dark-giallo-300);\n    --nc-giallo-400: var(--nc-dark-giallo-400);\n    --nc-giallo-500: var(--nc-dark-giallo-500);\n    --nc-giallo-600: var(--nc-dark-giallo-600);\n    --nc-giallo-700: var(--nc-dark-giallo-700);\n    --nc-giallo-800: var(--nc-dark-giallo-800);\n    --nc-giallo-900: var(--nc-dark-giallo-900);\n    --nc-giallo-1000: var(--nc-dark-giallo-1000);\n    --nc-verde-100: var(--nc-dark-verde-100);\n    --nc-verde-200: var(--nc-dark-verde-200);\n    --nc-verde-300: var(--nc-dark-verde-300);\n    --nc-verde-400: var(--nc-dark-verde-400);\n    --nc-verde-500: var(--nc-dark-verde-500);\n    --nc-verde-600: var(--nc-dark-verde-600);\n    --nc-verde-700: var(--nc-dark-verde-700);\n    --nc-verde-800: var(--nc-dark-verde-800);\n    --nc-verde-900: var(--nc-dark-verde-900);\n    --nc-verde-1000: var(--nc-dark-verde-1000);\n    --nc-acqua-100: var(--nc-dark-acqua-100);\n    --nc-acqua-200: var(--nc-dark-acqua-200);\n    --nc-acqua-300: var(--nc-dark-acqua-300);\n    --nc-acqua-400: var(--nc-dark-acqua-400);\n    --nc-acqua-500: var(--nc-dark-acqua-500);\n    --nc-acqua-600: var(--nc-dark-acqua-600);\n    --nc-acqua-700: var(--nc-dark-acqua-700);\n    --nc-acqua-800: var(--nc-dark-acqua-800);\n    --nc-acqua-900: var(--nc-dark-acqua-900);\n    --nc-acqua-1000: var(--nc-dark-acqua-1000);\n    --nc-viola-100: var(--nc-dark-viola-100);\n    --nc-viola-200: var(--nc-dark-viola-200);\n    --nc-viola-300: var(--nc-dark-viola-300);\n    --nc-viola-400: var(--nc-dark-viola-400);\n    --nc-viola-500: var(--nc-dark-viola-500);\n    --nc-viola-600: var(--nc-dark-viola-600);\n    --nc-viola-700: var(--nc-dark-viola-700);\n    --nc-viola-800: var(--nc-dark-viola-800);\n    --nc-viola-900: var(--nc-dark-viola-900);\n    --nc-viola-1000: var(--nc-dark-viola-1000);\n    --nc-rosa-100: var(--nc-dark-rosa-100);\n    --nc-rosa-200: var(--nc-dark-rosa-200);\n    --nc-rosa-300: var(--nc-dark-rosa-300);\n    --nc-rosa-400: var(--nc-dark-rosa-400);\n    --nc-rosa-500: var(--nc-dark-rosa-500);\n    --nc-rosa-600: var(--nc-dark-rosa-600);\n    --nc-rosa-700: var(--nc-dark-rosa-700);\n    --nc-rosa-800: var(--nc-dark-rosa-800);\n    --nc-rosa-900: var(--nc-dark-rosa-900);\n    --nc-rosa-1000: var(--nc-dark-rosa-1000);\n    --nc-category-teal-soft: var(--nc-dark-category-teal-soft);\n    --nc-category-teal-deep: var(--nc-dark-category-teal-deep);\n    --nc-category-purple-soft: var(--nc-dark-category-purple-soft);\n    --nc-category-purple-deep: var(--nc-dark-category-purple-deep);\n    --nc-category-pink-soft: var(--nc-dark-category-pink-soft);\n    --nc-category-pink-deep: var(--nc-dark-category-pink-deep);\n    --nc-elevation-resting:\n      0px 0px 0px 1px rgb(100% 100% 100% / 0.145),\n      0px 1px 2px 0px rgb(0% 0% 0% / 0.16),\n      0px 0px 0px 1px rgb(0% 0% 0%);\n    --nc-elevation-raised:\n      0px 0px 0px 1px rgb(100% 100% 100% / 0.145),\n      0px 2px 2px 0px rgb(0% 0% 0% / 0.2),\n      0px 8px 8px -8px rgb(0% 0% 0% / 0.3),\n      0px 0px 0px 1px rgb(0% 0% 0%);\n    --nc-elevation-floating:\n      0px 0px 0px 1px rgb(100% 100% 100% / 0.145),\n      0px 4px 8px -4px rgb(0% 0% 0% / 0.4),\n      0px 16px 24px -8px rgb(0% 0% 0% / 0.5),\n      0px 0px 0px 1px rgb(0% 0% 0%);\n    --nc-elevation-modal:\n      0px 0px 0px 1px rgb(100% 100% 100% / 0.145),\n      0px 8px 16px -4px rgb(0% 0% 0% / 0.4),\n      0px 24px 32px -8px rgb(0% 0% 0% / 0.55),\n      0px 0px 0px 1px rgb(0% 0% 0%);\n  }\n}";
+export const designTokensCss = "@layer tokens, theme;\n\n\n\n\n\n\n\n\n\n@layer tokens {\n  :root {\n    --nc-action: oklch(0.1776 0.0000 0.00);\n    --nc-action-foreground: oklch(1.0000 0.0000 0.00);\n    --nc-action-hover: oklch(0.3012 0.0000 0.00);\n    --nc-action-active: oklch(0.0000 0.0000 0.00);\n    --nc-ink: oklch(0.1776 0.0000 0.00);\n    --nc-body: oklch(0.5103 0.0000 0.00);\n    --nc-muted: oklch(0.5278 0.0000 0.00);\n    --nc-canvas: oklch(1.0000 0.0000 0.00);\n    --nc-canvas-soft: oklch(0.9851 0.0000 0.00);\n    --nc-canvas-soft-2: oklch(0.9702 0.0000 0.00);\n    --nc-material-workspace: oklch(0.9851 0.0000 0.00);\n    --nc-material-solid: oklch(1.0000 0.0000 0.00);\n    --nc-material-resting: oklch(1.0000 0.0000 0.00);\n    --nc-material-raised: oklch(1.0000 0.0000 0.00);\n    --nc-material-floating: oklch(1.0000 0.0000 0.00);\n    --nc-material-modal: oklch(1.0000 0.0000 0.00);\n    --nc-line: oklch(0.9219 0.0000 0.00);\n    --nc-input: oklch(0.5624 0.0000 0.00);\n    --nc-focus-ring: oklch(0.1776 0.0000 0.00);\n    --nc-scrim: oklch(0.0000 0.0000 0.00);\n    --nc-link: oklch(0.5339 0.1875 256.73);\n    --nc-link-deep: oklch(0.4653 0.1652 257.00);\n    --nc-link-bg-soft: oklch(0.9656 0.0171 248.01);\n    --nc-info: oklch(0.5005 0.2804 266.17);\n    --nc-info-soft: oklch(0.9457 0.0259 276.40);\n    --nc-info-deep: oklch(0.3197 0.1758 266.79);\n    --nc-success: oklch(0.6415 0.1644 153.23);\n    --nc-success-soft: oklch(0.9170 0.0519 161.77);\n    --nc-success-deep: oklch(0.3852 0.0953 154.99);\n    --nc-error: oklch(0.5688 0.1995 26.59);\n    --nc-error-soft: oklch(0.9522 0.0207 17.52);\n    --nc-error-deep: oklch(0.4235 0.1525 27.08);\n    --nc-warning: oklch(0.8466 0.1678 84.63);\n    --nc-warning-soft: oklch(0.9649 0.0461 90.87);\n    --nc-warning-deep: oklch(0.4834 0.0995 82.44);\n    --nc-navigation-selection-bg: oklch(0.9461 0.0000 0.00);\n    --nc-navigation-selection-fg: oklch(0.1776 0.0000 0.00);\n    --nc-navigation-selection-hover: oklch(0.9219 0.0000 0.00);\n    --nc-state-ready: oklch(0.5278 0.0000 0.00);\n    --nc-state-running: oklch(0.5005 0.2804 266.17);\n    --nc-state-review: oklch(0.8466 0.1678 84.63);\n    --nc-state-blocked: oklch(0.5688 0.1995 26.59);\n    --nc-state-complete: oklch(0.6415 0.1644 153.23);\n    --nc-identity-verde: oklch(0.6415 0.1644 153.23);\n    --nc-identity-rosso: oklch(0.5688 0.1995 26.59);\n    --nc-identity-arancio: oklch(0.6824 0.2108 37.70);\n    --nc-identity-giallo: oklch(0.8466 0.1678 84.63);\n    --nc-identity-cobalto: oklch(0.5005 0.2804 266.17);\n    --nc-identity-azzurro: oklch(0.5618 0.2019 258.24);\n    --nc-identity-ink: oklch(0.0000 0.0000 0.00);\n    --nc-identity-white: oklch(1.0000 0.0000 0.00);\n    --nc-logo-dot: oklch(0.5005 0.2804 266.17);\n    --nc-chart-1: oklch(0.5005 0.2804 266.17);\n    --nc-chart-2: oklch(0.6398 0.2044 356.46);\n    --nc-chart-3: oklch(0.5015 0.1883 294.99);\n    --nc-chart-4: oklch(0.6824 0.2108 37.70);\n    --nc-chart-5: oklch(0.6161 0.1062 208.85);\n    --nc-chart-6: oklch(0.5688 0.1995 26.59);\n    --nc-chart-7: oklch(0.7691 0.1577 84.69);\n    --nc-chart-8: oklch(0.6415 0.1644 153.23);\n    --nc-chart-9: oklch(0.7191 0.1452 266.33);\n    --nc-chart-10: oklch(0.8309 0.1048 356.57);\n    --nc-cobalto-100: oklch(0.9754 0.0115 264.51);\n    --nc-cobalto-200: oklch(0.9543 0.0215 265.76);\n    --nc-cobalto-300: oklch(0.9297 0.0334 265.23);\n    --nc-cobalto-400: oklch(0.8944 0.0509 267.00);\n    --nc-cobalto-500: oklch(0.8308 0.0837 265.90);\n    --nc-cobalto-600: oklch(0.7191 0.1452 266.33);\n    --nc-cobalto-700: oklch(0.5005 0.2804 266.17);\n    --nc-cobalto-800: oklch(0.4602 0.2797 266.14);\n    --nc-cobalto-900: oklch(0.4202 0.2522 266.14);\n    --nc-cobalto-1000: oklch(0.2811 0.1684 266.17);\n    --nc-rosso-100: oklch(0.9752 0.0122 29.87);\n    --nc-rosso-200: oklch(0.9552 0.0222 27.81);\n    --nc-rosso-300: oklch(0.9290 0.0360 26.28);\n    --nc-rosso-400: oklch(0.8944 0.0552 26.52);\n    --nc-rosso-500: oklch(0.8304 0.0942 26.48);\n    --nc-rosso-600: oklch(0.7201 0.1742 26.79);\n    --nc-rosso-700: oklch(0.5688 0.1995 26.59);\n    --nc-rosso-800: oklch(0.5297 0.1996 26.67);\n    --nc-rosso-900: oklch(0.4882 0.1797 26.59);\n    --nc-rosso-1000: oklch(0.2805 0.1143 26.81);\n    --nc-arancio-100: oklch(0.9749 0.0125 35.73);\n    --nc-arancio-200: oklch(0.9544 0.0233 37.38);\n    --nc-arancio-300: oklch(0.9298 0.0366 36.77);\n    --nc-arancio-400: oklch(0.8945 0.0567 37.21);\n    --nc-arancio-500: oklch(0.8292 0.0974 37.12);\n    --nc-arancio-600: oklch(0.7428 0.1602 37.76);\n    --nc-arancio-700: oklch(0.6824 0.2108 37.70);\n    --nc-arancio-800: oklch(0.6419 0.2102 37.75);\n    --nc-arancio-900: oklch(0.4993 0.1647 37.64);\n    --nc-arancio-1000: oklch(0.2801 0.0916 38.02);\n    --nc-giallo-100: oklch(0.9860 0.0154 86.42);\n    --nc-giallo-200: oklch(0.9699 0.0272 83.54);\n    --nc-giallo-300: oklch(0.9555 0.0420 85.96);\n    --nc-giallo-400: oklch(0.9298 0.0673 84.45);\n    --nc-giallo-500: oklch(0.9004 0.1074 84.93);\n    --nc-giallo-600: oklch(0.8696 0.1403 84.42);\n    --nc-giallo-700: oklch(0.8466 0.1678 84.63);\n    --nc-giallo-800: oklch(0.7691 0.1577 84.69);\n    --nc-giallo-900: oklch(0.5305 0.1090 83.33);\n    --nc-giallo-1000: oklch(0.3186 0.0654 84.14);\n    --nc-verde-100: oklch(0.9747 0.0157 154.48);\n    --nc-verde-200: oklch(0.9560 0.0265 152.38);\n    --nc-verde-300: oklch(0.9290 0.0407 153.11);\n    --nc-verde-400: oklch(0.8955 0.0664 152.93);\n    --nc-verde-500: oklch(0.8310 0.1403 153.27);\n    --nc-verde-600: oklch(0.7191 0.1645 153.16);\n    --nc-verde-700: oklch(0.6415 0.1644 153.23);\n    --nc-verde-800: oklch(0.6017 0.1542 153.23);\n    --nc-verde-900: oklch(0.4992 0.1279 153.23);\n    --nc-verde-1000: oklch(0.2815 0.0723 153.13);\n    --nc-acqua-100: oklch(0.9752 0.0109 211.04);\n    --nc-acqua-200: oklch(0.9559 0.0171 205.84);\n    --nc-acqua-300: oklch(0.9297 0.0259 208.75);\n    --nc-acqua-400: oklch(0.8954 0.0424 207.56);\n    --nc-acqua-500: oklch(0.8304 0.0902 209.06);\n    --nc-acqua-600: oklch(0.7205 0.1064 208.54);\n    --nc-acqua-700: oklch(0.6161 0.1062 208.85);\n    --nc-acqua-800: oklch(0.5765 0.0992 208.28);\n    --nc-acqua-900: oklch(0.4990 0.0860 208.78);\n    --nc-acqua-1000: oklch(0.2797 0.0484 210.29);\n    --nc-viola-100: oklch(0.9745 0.0134 295.33);\n    --nc-viola-200: oklch(0.9545 0.0243 296.12);\n    --nc-viola-300: oklch(0.9290 0.0381 295.47);\n    --nc-viola-400: oklch(0.8954 0.0563 294.18);\n    --nc-viola-500: oklch(0.8289 0.0954 295.03);\n    --nc-viola-600: oklch(0.7204 0.1631 294.91);\n    --nc-viola-700: oklch(0.5015 0.1883 294.99);\n    --nc-viola-800: oklch(0.4620 0.1886 294.84);\n    --nc-viola-900: oklch(0.4227 0.1694 295.05);\n    --nc-viola-1000: oklch(0.2796 0.1131 295.14);\n    --nc-rosa-100: oklch(0.9746 0.0139 355.00);\n    --nc-rosa-200: oklch(0.9555 0.0241 358.28);\n    --nc-rosa-300: oklch(0.9307 0.0386 357.63);\n    --nc-rosa-400: oklch(0.8944 0.0614 356.49);\n    --nc-rosa-500: oklch(0.8309 0.1048 356.57);\n    --nc-rosa-600: oklch(0.7193 0.1969 356.59);\n    --nc-rosa-700: oklch(0.6398 0.2044 356.46);\n    --nc-rosa-800: oklch(0.6001 0.2050 356.50);\n    --nc-rosa-900: oklch(0.5009 0.1842 356.43);\n    --nc-rosa-1000: oklch(0.2808 0.1147 356.80);\n    --nc-dark-canvas: oklch(0.0000 0.0000 0.00);\n    --nc-dark-canvas-soft: oklch(0.1776 0.0000 0.00);\n    --nc-dark-canvas-soft-2: oklch(0.2178 0.0000 0.00);\n    --nc-dark-material-workspace: oklch(0.0000 0.0000 0.00);\n    --nc-dark-material-solid: oklch(0.0000 0.0000 0.00);\n    --nc-dark-material-resting: oklch(0.1448 0.0000 0.00);\n    --nc-dark-material-raised: oklch(0.1448 0.0000 0.00);\n    --nc-dark-material-floating: oklch(0.1448 0.0000 0.00);\n    --nc-dark-material-modal: oklch(0.1776 0.0000 0.00);\n    --nc-dark-ink: oklch(0.9461 0.0000 0.00);\n    --nc-dark-body: oklch(0.7090 0.0000 0.00);\n    --nc-dark-muted: oklch(0.6993 0.0000 0.00);\n    --nc-dark-line: oklch(0.2686 0.0000 0.00);\n    --nc-dark-input: oklch(0.5590 0.0000 0.00);\n    --nc-dark-on-primary: oklch(0.1448 0.0000 0.00);\n    --nc-dark-action: oklch(0.9461 0.0000 0.00);\n    --nc-dark-action-foreground: oklch(0.1448 0.0000 0.00);\n    --nc-dark-action-hover: oklch(0.8761 0.0000 0.00);\n    --nc-dark-action-active: oklch(0.8297 0.0000 0.00);\n    --nc-dark-link: oklch(0.7173 0.1522 251.00);\n    --nc-dark-link-deep: oklch(0.8135 0.0986 247.81);\n    --nc-dark-link-bg-soft: oklch(0.2518 0.0572 257.41);\n    --nc-dark-focus-ring: oklch(0.9461 0.0000 0.00);\n    --nc-dark-scrim: oklch(0.0000 0.0000 0.00);\n    --nc-dark-error: oklch(0.7955 0.0980 21.02);\n    --nc-dark-error-soft: oklch(0.2296 0.0728 26.06);\n    --nc-dark-error-deep: oklch(0.8856 0.0534 19.64);\n    --nc-dark-warning: oklch(0.8939 0.1387 90.47);\n    --nc-dark-warning-soft: oklch(0.3135 0.0643 85.04);\n    --nc-dark-warning-deep: oklch(0.9320 0.0896 90.86);\n    --nc-dark-info: oklch(0.7067 0.1528 272.08);\n    --nc-dark-info-soft: oklch(0.2118 0.1033 268.28);\n    --nc-dark-info-deep: oklch(0.8222 0.0888 274.44);\n    --nc-dark-success: oklch(0.7019 0.1753 153.20);\n    --nc-dark-success-soft: oklch(0.2893 0.0697 156.32);\n    --nc-dark-success-deep: oklch(0.8524 0.0996 159.83);\n    --nc-dark-state-ready: oklch(0.5624 0.0000 0.00);\n    --nc-dark-state-running: oklch(0.5923 0.2215 269.61);\n    --nc-dark-state-review: oklch(0.8466 0.1678 84.63);\n    --nc-dark-state-blocked: oklch(0.5688 0.1995 26.59);\n    --nc-dark-state-complete: oklch(0.6415 0.1644 153.23);\n    --nc-dark-logo-dot: oklch(0.5923 0.2215 269.61);\n    --nc-dark-navigation-selection-bg: oklch(0.2393 0.0000 0.00);\n    --nc-dark-navigation-selection-fg: oklch(0.9461 0.0000 0.00);\n    --nc-dark-navigation-selection-hover: oklch(0.2686 0.0000 0.00);\n    --nc-dark-chart-1: oklch(0.6007 0.2160 266.02);\n    --nc-dark-chart-2: oklch(0.6611 0.1941 356.61);\n    --nc-dark-chart-3: oklch(0.6004 0.1789 294.79);\n    --nc-dark-chart-4: oklch(0.6612 0.2003 37.74);\n    --nc-dark-chart-5: oklch(0.6568 0.1009 208.69);\n    --nc-dark-chart-6: oklch(0.6084 0.1887 26.65);\n    --nc-dark-chart-7: oklch(0.8466 0.1678 84.63);\n    --nc-dark-chart-8: oklch(0.6608 0.1568 153.03);\n    --nc-dark-chart-9: oklch(0.7993 0.1005 266.67);\n    --nc-dark-chart-10: oklch(0.8005 0.1279 356.32);\n    --nc-dark-cobalto-100: oklch(0.1915 0.0982 266.32);\n    --nc-dark-cobalto-200: oklch(0.2197 0.1184 266.25);\n    --nc-dark-cobalto-300: oklch(0.2604 0.1398 265.97);\n    --nc-dark-cobalto-400: oklch(0.2997 0.1624 266.24);\n    --nc-dark-cobalto-500: oklch(0.3702 0.1966 266.08);\n    --nc-dark-cobalto-600: oklch(0.6007 0.2160 266.02);\n    --nc-dark-cobalto-700: oklch(0.5005 0.2804 266.17);\n    --nc-dark-cobalto-800: oklch(0.4602 0.2797 266.14);\n    --nc-dark-cobalto-900: oklch(0.7993 0.1005 266.67);\n    --nc-dark-cobalto-1000: oklch(0.9604 0.0186 265.98);\n    --nc-dark-rosso-100: oklch(0.1907 0.0689 26.80);\n    --nc-dark-rosso-200: oklch(0.2215 0.0837 26.41);\n    --nc-dark-rosso-300: oklch(0.2596 0.0994 26.37);\n    --nc-dark-rosso-400: oklch(0.3014 0.1159 26.97);\n    --nc-dark-rosso-500: oklch(0.3705 0.1397 26.54);\n    --nc-dark-rosso-600: oklch(0.6084 0.1887 26.65);\n    --nc-dark-rosso-700: oklch(0.5688 0.1995 26.59);\n    --nc-dark-rosso-800: oklch(0.5297 0.1996 26.67);\n    --nc-dark-rosso-900: oklch(0.7992 0.1149 26.43);\n    --nc-dark-rosso-1000: oklch(0.9598 0.0198 25.17);\n    --nc-dark-arancio-100: oklch(0.1909 0.0632 37.47);\n    --nc-dark-arancio-200: oklch(0.2201 0.0732 37.26);\n    --nc-dark-arancio-300: oklch(0.2598 0.0852 37.90);\n    --nc-dark-arancio-400: oklch(0.2988 0.0989 37.50);\n    --nc-dark-arancio-500: oklch(0.3706 0.1219 37.77);\n    --nc-dark-arancio-600: oklch(0.6612 0.2003 37.74);\n    --nc-dark-arancio-700: oklch(0.6824 0.2108 37.70);\n    --nc-dark-arancio-800: oklch(0.6419 0.2102 37.75);\n    --nc-dark-arancio-900: oklch(0.7993 0.1180 37.52);\n    --nc-dark-arancio-1000: oklch(0.9590 0.0208 36.03);\n    --nc-dark-giallo-100: oklch(0.1903 0.0391 84.07);\n    --nc-dark-giallo-200: oklch(0.2185 0.0449 83.81);\n    --nc-dark-giallo-300: oklch(0.2592 0.0532 83.54);\n    --nc-dark-giallo-400: oklch(0.3008 0.0616 85.18);\n    --nc-dark-giallo-500: oklch(0.3705 0.0759 85.25);\n    --nc-dark-giallo-600: oklch(0.6598 0.1353 84.83);\n    --nc-dark-giallo-700: oklch(0.8466 0.1678 84.63);\n    --nc-dark-giallo-800: oklch(0.8064 0.1654 84.43);\n    --nc-dark-giallo-900: oklch(0.8007 0.1595 84.74);\n    --nc-dark-giallo-1000: oklch(0.9604 0.0256 84.59);\n    --nc-dark-verde-100: oklch(0.1910 0.0488 153.39);\n    --nc-dark-verde-200: oklch(0.2208 0.0571 152.80);\n    --nc-dark-verde-300: oklch(0.2606 0.0664 153.49);\n    --nc-dark-verde-400: oklch(0.2987 0.0765 153.24);\n    --nc-dark-verde-500: oklch(0.3685 0.0944 153.24);\n    --nc-dark-verde-600: oklch(0.6608 0.1568 153.03);\n    --nc-dark-verde-700: oklch(0.6415 0.1644 153.23);\n    --nc-dark-verde-800: oklch(0.6017 0.1542 153.23);\n    --nc-dark-verde-900: oklch(0.7994 0.1555 153.29);\n    --nc-dark-verde-1000: oklch(0.9600 0.0248 152.88);\n    --nc-dark-acqua-100: oklch(0.1914 0.0330 209.05);\n    --nc-dark-acqua-200: oklch(0.2192 0.0379 209.81);\n    --nc-dark-acqua-300: oklch(0.2610 0.0450 209.30);\n    --nc-dark-acqua-400: oklch(0.3011 0.0519 208.95);\n    --nc-dark-acqua-500: oklch(0.3711 0.0639 208.82);\n    --nc-dark-acqua-600: oklch(0.6568 0.1009 208.69);\n    --nc-dark-acqua-700: oklch(0.6161 0.1062 208.85);\n    --nc-dark-acqua-800: oklch(0.5765 0.0992 208.28);\n    --nc-dark-acqua-900: oklch(0.8004 0.1007 208.37);\n    --nc-dark-acqua-1000: oklch(0.9596 0.0161 206.44);\n    --nc-dark-viola-100: oklch(0.1897 0.0654 295.79);\n    --nc-dark-viola-200: oklch(0.2192 0.0805 294.49);\n    --nc-dark-viola-300: oklch(0.2605 0.0949 295.18);\n    --nc-dark-viola-400: oklch(0.2990 0.1087 294.76);\n    --nc-dark-viola-500: oklch(0.3702 0.1310 295.14);\n    --nc-dark-viola-600: oklch(0.6004 0.1789 294.79);\n    --nc-dark-viola-700: oklch(0.5015 0.1883 294.99);\n    --nc-dark-viola-800: oklch(0.4620 0.1886 294.84);\n    --nc-dark-viola-900: oklch(0.8000 0.1131 295.20);\n    --nc-dark-viola-1000: oklch(0.9591 0.0215 294.60);\n    --nc-dark-rosa-100: oklch(0.1902 0.0716 355.67);\n    --nc-dark-rosa-200: oklch(0.2198 0.0850 357.06);\n    --nc-dark-rosa-300: oklch(0.2591 0.1026 356.37);\n    --nc-dark-rosa-400: oklch(0.3000 0.1188 356.62);\n    --nc-dark-rosa-500: oklch(0.3695 0.1426 356.71);\n    --nc-dark-rosa-600: oklch(0.6611 0.1941 356.61);\n    --nc-dark-rosa-700: oklch(0.6398 0.2044 356.46);\n    --nc-dark-rosa-800: oklch(0.6001 0.2050 356.50);\n    --nc-dark-rosa-900: oklch(0.8005 0.1279 356.32);\n    --nc-dark-rosa-1000: oklch(0.9599 0.0220 356.32);\n    --nc-category-teal-soft: oklch(0.9585 0.0244 187.32);\n    --nc-category-teal-deep: oklch(0.4600 0.0788 185.34);\n    --nc-dark-category-teal-soft: oklch(0.2627 0.0410 187.13);\n    --nc-dark-category-teal-deep: oklch(0.8398 0.1008 186.70);\n    --nc-category-purple-soft: oklch(0.9464 0.0327 307.17);\n    --nc-category-purple-deep: oklch(0.4541 0.1958 308.26);\n    --nc-dark-category-purple-soft: oklch(0.2479 0.0790 306.78);\n    --nc-dark-category-purple-deep: oklch(0.7911 0.1271 310.92);\n    --nc-category-pink-soft: oklch(0.9476 0.0263 347.12);\n    --nc-category-pink-deep: oklch(0.4863 0.1711 355.09);\n    --nc-dark-category-pink-soft: oklch(0.2550 0.0598 353.51);\n    --nc-dark-category-pink-deep: oklch(0.8108 0.1129 347.21);\n    --nc-xxs: 4px;\n    --nc-xs: 8px;\n    --nc-sm: 12px;\n    --nc-md: 16px;\n    --nc-lg: 24px;\n    --nc-xl: 32px;\n    --nc-2xl: 40px;\n    --nc-3xl: 48px;\n    --nc-4xl: 64px;\n    --nc-5xl: 96px;\n    --nc-6xl: 128px;\n    --nc-guide: 1px;\n    --nc-icon-stroke: 1.5px;\n    --nc-icon-stroke-sm: 1.25px;\n    --nc-focus-outline-width: 2px;\n    --nc-focus-outline-offset: 2px;\n    --nc-control-height: 36px;\n    --nc-control-height-sm: 32px;\n    --nc-control-height-lg: 40px;\n    --nc-control-height-xs: 24px;\n    --nc-control-padding-inline: 12px;\n    --nc-card-padding: 20px;\n    --nc-touch-target: 44px;\n    --nc-rounded-none: 0px;\n    --nc-rounded-xs: 2px;\n    --nc-rounded-sm: 6px;\n    --nc-rounded-md: 8px;\n    --nc-rounded-lg: 12px;\n    --nc-rounded-xl: 16px;\n    --nc-rounded-2xl: 20px;\n    --nc-rounded-3xl: 24px;\n    --nc-rounded-full: 9999px;\n    --nc-type-display-xl-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-display-xl-font-size: 72px;\n    --nc-type-display-xl-font-weight: 600;\n    --nc-type-display-xl-line-height: 72px;\n    --nc-type-display-xl-letter-spacing: -4.32px;\n    --nc-type-display-wide-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-display-wide-font-size: 64px;\n    --nc-type-display-wide-font-weight: 600;\n    --nc-type-display-wide-line-height: 64px;\n    --nc-type-display-wide-letter-spacing: -3.84px;\n    --nc-type-display-lg-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-display-lg-font-size: 56px;\n    --nc-type-display-lg-font-weight: 600;\n    --nc-type-display-lg-line-height: 56px;\n    --nc-type-display-lg-letter-spacing: -3.36px;\n    --nc-type-display-section-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-display-section-font-size: 48px;\n    --nc-type-display-section-font-weight: 600;\n    --nc-type-display-section-line-height: 56px;\n    --nc-type-display-section-letter-spacing: -2.88px;\n    --nc-type-display-md-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-display-md-font-size: 40px;\n    --nc-type-display-md-font-weight: 600;\n    --nc-type-display-md-line-height: 48px;\n    --nc-type-display-md-letter-spacing: -2.4px;\n    --nc-type-heading-lg-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-heading-lg-font-size: 32px;\n    --nc-type-heading-lg-font-weight: 600;\n    --nc-type-heading-lg-line-height: 40px;\n    --nc-type-heading-lg-letter-spacing: -1.28px;\n    --nc-type-heading-md-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-heading-md-font-size: 24px;\n    --nc-type-heading-md-font-weight: 600;\n    --nc-type-heading-md-line-height: 32px;\n    --nc-type-heading-md-letter-spacing: -0.96px;\n    --nc-type-heading-sm-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-heading-sm-font-size: 20px;\n    --nc-type-heading-sm-font-weight: 600;\n    --nc-type-heading-sm-line-height: 26px;\n    --nc-type-heading-sm-letter-spacing: -0.4px;\n    --nc-type-heading-xs-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-heading-xs-font-size: 16px;\n    --nc-type-heading-xs-font-weight: 600;\n    --nc-type-heading-xs-line-height: 24px;\n    --nc-type-heading-xs-letter-spacing: -0.32px;\n    --nc-type-heading-compact-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-heading-compact-font-size: 14px;\n    --nc-type-heading-compact-font-weight: 600;\n    --nc-type-heading-compact-line-height: 20px;\n    --nc-type-heading-compact-letter-spacing: -0.28px;\n    --nc-type-button-lg-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-button-lg-font-size: 16px;\n    --nc-type-button-lg-font-weight: 500;\n    --nc-type-button-lg-line-height: 20px;\n    --nc-type-button-lg-letter-spacing: 0px;\n    --nc-type-button-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-button-font-size: 14px;\n    --nc-type-button-font-weight: 500;\n    --nc-type-button-line-height: 20px;\n    --nc-type-button-letter-spacing: 0px;\n    --nc-type-button-xs-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-button-xs-font-size: 12px;\n    --nc-type-button-xs-font-weight: 500;\n    --nc-type-button-xs-line-height: 16px;\n    --nc-type-button-xs-letter-spacing: 0px;\n    --nc-type-label-display-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-label-display-font-size: 20px;\n    --nc-type-label-display-font-weight: 400;\n    --nc-type-label-display-line-height: 32px;\n    --nc-type-label-display-letter-spacing: 0px;\n    --nc-type-label-lg-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-label-lg-font-size: 18px;\n    --nc-type-label-lg-font-weight: 400;\n    --nc-type-label-lg-line-height: 20px;\n    --nc-type-label-lg-letter-spacing: 0px;\n    --nc-type-label-md-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-label-md-font-size: 16px;\n    --nc-type-label-md-font-weight: 400;\n    --nc-type-label-md-line-height: 20px;\n    --nc-type-label-md-letter-spacing: 0px;\n    --nc-type-label-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-label-font-size: 14px;\n    --nc-type-label-font-weight: 400;\n    --nc-type-label-line-height: 20px;\n    --nc-type-label-letter-spacing: 0px;\n    --nc-type-label-sm-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-label-sm-font-size: 13px;\n    --nc-type-label-sm-font-weight: 400;\n    --nc-type-label-sm-line-height: 16px;\n    --nc-type-label-sm-letter-spacing: 0px;\n    --nc-type-caption-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-caption-font-size: 12px;\n    --nc-type-caption-font-weight: 400;\n    --nc-type-caption-line-height: 16px;\n    --nc-type-caption-letter-spacing: 0px;\n    --nc-type-label-mono-lg-font-family:\n      Geist Mono,\n      ui-monospace,\n      SFMono-Regular,\n      Menlo,\n      Monaco,\n      monospace;\n    --nc-type-label-mono-lg-font-size: 14px;\n    --nc-type-label-mono-lg-font-weight: 400;\n    --nc-type-label-mono-lg-line-height: 20px;\n    --nc-type-label-mono-lg-letter-spacing: 0px;\n    --nc-type-label-mono-md-font-family:\n      Geist Mono,\n      ui-monospace,\n      SFMono-Regular,\n      Menlo,\n      Monaco,\n      monospace;\n    --nc-type-label-mono-md-font-size: 13px;\n    --nc-type-label-mono-md-font-weight: 400;\n    --nc-type-label-mono-md-line-height: 20px;\n    --nc-type-label-mono-md-letter-spacing: 0px;\n    --nc-type-label-mono-font-family:\n      Geist Mono,\n      ui-monospace,\n      SFMono-Regular,\n      Menlo,\n      Monaco,\n      monospace;\n    --nc-type-label-mono-font-size: 12px;\n    --nc-type-label-mono-font-weight: 400;\n    --nc-type-label-mono-line-height: 16px;\n    --nc-type-label-mono-letter-spacing: 0px;\n    --nc-type-body-display-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-body-display-font-size: 24px;\n    --nc-type-body-display-font-weight: 400;\n    --nc-type-body-display-line-height: 36px;\n    --nc-type-body-display-letter-spacing: 0px;\n    --nc-type-body-lead-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-body-lead-font-size: 20px;\n    --nc-type-body-lead-font-weight: 400;\n    --nc-type-body-lead-line-height: 36px;\n    --nc-type-body-lead-letter-spacing: 0px;\n    --nc-type-body-lg-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-body-lg-font-size: 18px;\n    --nc-type-body-lg-font-weight: 400;\n    --nc-type-body-lg-line-height: 28px;\n    --nc-type-body-lg-letter-spacing: 0px;\n    --nc-type-body-md-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-body-md-font-size: 16px;\n    --nc-type-body-md-font-weight: 400;\n    --nc-type-body-md-line-height: 24px;\n    --nc-type-body-md-letter-spacing: 0px;\n    --nc-type-body-sm-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-body-sm-font-size: 14px;\n    --nc-type-body-sm-font-weight: 400;\n    --nc-type-body-sm-line-height: 20px;\n    --nc-type-body-sm-letter-spacing: 0px;\n    --nc-type-body-compact-font-family:\n      Geist,\n      Inter,\n      system-ui,\n      -apple-system,\n      sans-serif;\n    --nc-type-body-compact-font-size: 13px;\n    --nc-type-body-compact-font-weight: 400;\n    --nc-type-body-compact-line-height: 18px;\n    --nc-type-body-compact-letter-spacing: 0px;\n    --nc-type-code-font-family:\n      Geist Mono,\n      ui-monospace,\n      SFMono-Regular,\n      Menlo,\n      Monaco,\n      monospace;\n    --nc-type-code-font-size: 13px;\n    --nc-type-code-font-weight: 400;\n    --nc-type-code-line-height: 18px;\n    --nc-type-code-letter-spacing: 0px;\n    --nc-material-scrim-opacity: 50%;\n    --nc-material-glass-opacity: 60%;\n    --nc-material-glass-saturation: 180%;\n    --nc-material-glass-blur: 20px;\n    --nc-material-glass-highlight: inset 0px 1px 0px 0px rgb(100% 100% 100% / 0.18);\n    --nc-elevation-resting:\n      0px 0px 0px 1px rgb(0% 0% 0% / 0.08),\n      0px 2px 2px 0px rgb(0% 0% 0% / 0.04),\n      0px 0px 0px 1px rgb(100% 100% 100%);\n    --nc-elevation-raised:\n      0px 0px 0px 1px rgb(0% 0% 0% / 0.08),\n      0px 2px 2px 0px rgb(0% 0% 0% / 0.04),\n      0px 8px 8px -8px rgb(0% 0% 0% / 0.04),\n      0px 0px 0px 1px rgb(100% 100% 100%);\n    --nc-elevation-floating:\n      0px 0px 0px 1px rgb(0% 0% 0% / 0.08),\n      0px 1px 1px 0px rgb(0% 0% 0% / 0.02),\n      0px 4px 8px -4px rgb(0% 0% 0% / 0.04),\n      0px 16px 24px -8px rgb(0% 0% 0% / 0.06),\n      0px 0px 0px 1px rgb(100% 100% 100%);\n    --nc-elevation-modal:\n      0px 0px 0px 1px rgb(0% 0% 0% / 0.08),\n      0px 1px 1px 0px rgb(0% 0% 0% / 0.02),\n      0px 8px 16px -4px rgb(0% 0% 0% / 0.04),\n      0px 24px 32px -8px rgb(0% 0% 0% / 0.06),\n      0px 0px 0px 1px rgb(100% 100% 100%);\n    --nc-duration-control: 100ms;\n    --nc-duration-close: 140ms;\n    --nc-duration-confirm: 180ms;\n    --nc-duration-open: 220ms;\n    --nc-duration-msg-in: 240ms;\n    --nc-duration-transition: 240ms;\n    --nc-duration-arrive: 300ms;\n    --nc-duration-drawer-swipe: 400ms;\n    --nc-duration-drawer: 450ms;\n    --nc-duration-wait: 1.6s;\n    --nc-ease-emphasized: cubic-bezier(0.3, 0.7, 0.2, 1);\n    --nc-ease-out-strong: cubic-bezier(0.23, 1, 0.32, 1);\n    --nc-ease-in-out-strong: cubic-bezier(0.77, 0, 0.175, 1);\n    --nc-ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);\n    --nc-content-max: 1200px;\n    --nc-gutter-mobile: 20px;\n    --nc-gutter-tablet: 40px;\n    --nc-gutter-desktop: 64px;\n    --nc-section-step-mobile: 64px;\n    --nc-section-step-desktop: 96px;\n  }\n}\n\n\n@layer theme {\n  .dark {\n    --nc-canvas: var(--nc-dark-canvas);\n    --nc-canvas-soft: var(--nc-dark-canvas-soft);\n    --nc-canvas-soft-2: var(--nc-dark-canvas-soft-2);\n    --nc-material-workspace: var(--nc-dark-material-workspace);\n    --nc-material-solid: var(--nc-dark-material-solid);\n    --nc-material-resting: var(--nc-dark-material-resting);\n    --nc-material-raised: var(--nc-dark-material-raised);\n    --nc-material-floating: var(--nc-dark-material-floating);\n    --nc-material-modal: var(--nc-dark-material-modal);\n    --nc-ink: var(--nc-dark-ink);\n    --nc-body: var(--nc-dark-body);\n    --nc-muted: var(--nc-dark-muted);\n    --nc-line: var(--nc-dark-line);\n    --nc-input: var(--nc-dark-input);\n    --nc-action: var(--nc-dark-action);\n    --nc-action-foreground: var(--nc-dark-action-foreground);\n    --nc-action-hover: var(--nc-dark-action-hover);\n    --nc-action-active: var(--nc-dark-action-active);\n    --nc-link: var(--nc-dark-link);\n    --nc-link-deep: var(--nc-dark-link-deep);\n    --nc-link-bg-soft: var(--nc-dark-link-bg-soft);\n    --nc-focus-ring: var(--nc-dark-focus-ring);\n    --nc-scrim: var(--nc-dark-scrim);\n    --nc-error: var(--nc-dark-error);\n    --nc-error-soft: var(--nc-dark-error-soft);\n    --nc-error-deep: var(--nc-dark-error-deep);\n    --nc-warning: var(--nc-dark-warning);\n    --nc-warning-soft: var(--nc-dark-warning-soft);\n    --nc-warning-deep: var(--nc-dark-warning-deep);\n    --nc-info: var(--nc-dark-info);\n    --nc-info-soft: var(--nc-dark-info-soft);\n    --nc-info-deep: var(--nc-dark-info-deep);\n    --nc-success: var(--nc-dark-success);\n    --nc-success-soft: var(--nc-dark-success-soft);\n    --nc-success-deep: var(--nc-dark-success-deep);\n    --nc-state-ready: var(--nc-dark-state-ready);\n    --nc-state-running: var(--nc-dark-state-running);\n    --nc-state-review: var(--nc-dark-state-review);\n    --nc-state-blocked: var(--nc-dark-state-blocked);\n    --nc-state-complete: var(--nc-dark-state-complete);\n    --nc-logo-dot: var(--nc-dark-logo-dot);\n    --nc-navigation-selection-bg: var(--nc-dark-navigation-selection-bg);\n    --nc-navigation-selection-fg: var(--nc-dark-navigation-selection-fg);\n    --nc-navigation-selection-hover: var(--nc-dark-navigation-selection-hover);\n    --nc-chart-1: var(--nc-dark-chart-1);\n    --nc-chart-2: var(--nc-dark-chart-2);\n    --nc-chart-3: var(--nc-dark-chart-3);\n    --nc-chart-4: var(--nc-dark-chart-4);\n    --nc-chart-5: var(--nc-dark-chart-5);\n    --nc-chart-6: var(--nc-dark-chart-6);\n    --nc-chart-7: var(--nc-dark-chart-7);\n    --nc-chart-8: var(--nc-dark-chart-8);\n    --nc-chart-9: var(--nc-dark-chart-9);\n    --nc-chart-10: var(--nc-dark-chart-10);\n    --nc-cobalto-100: var(--nc-dark-cobalto-100);\n    --nc-cobalto-200: var(--nc-dark-cobalto-200);\n    --nc-cobalto-300: var(--nc-dark-cobalto-300);\n    --nc-cobalto-400: var(--nc-dark-cobalto-400);\n    --nc-cobalto-500: var(--nc-dark-cobalto-500);\n    --nc-cobalto-600: var(--nc-dark-cobalto-600);\n    --nc-cobalto-700: var(--nc-dark-cobalto-700);\n    --nc-cobalto-800: var(--nc-dark-cobalto-800);\n    --nc-cobalto-900: var(--nc-dark-cobalto-900);\n    --nc-cobalto-1000: var(--nc-dark-cobalto-1000);\n    --nc-rosso-100: var(--nc-dark-rosso-100);\n    --nc-rosso-200: var(--nc-dark-rosso-200);\n    --nc-rosso-300: var(--nc-dark-rosso-300);\n    --nc-rosso-400: var(--nc-dark-rosso-400);\n    --nc-rosso-500: var(--nc-dark-rosso-500);\n    --nc-rosso-600: var(--nc-dark-rosso-600);\n    --nc-rosso-700: var(--nc-dark-rosso-700);\n    --nc-rosso-800: var(--nc-dark-rosso-800);\n    --nc-rosso-900: var(--nc-dark-rosso-900);\n    --nc-rosso-1000: var(--nc-dark-rosso-1000);\n    --nc-arancio-100: var(--nc-dark-arancio-100);\n    --nc-arancio-200: var(--nc-dark-arancio-200);\n    --nc-arancio-300: var(--nc-dark-arancio-300);\n    --nc-arancio-400: var(--nc-dark-arancio-400);\n    --nc-arancio-500: var(--nc-dark-arancio-500);\n    --nc-arancio-600: var(--nc-dark-arancio-600);\n    --nc-arancio-700: var(--nc-dark-arancio-700);\n    --nc-arancio-800: var(--nc-dark-arancio-800);\n    --nc-arancio-900: var(--nc-dark-arancio-900);\n    --nc-arancio-1000: var(--nc-dark-arancio-1000);\n    --nc-giallo-100: var(--nc-dark-giallo-100);\n    --nc-giallo-200: var(--nc-dark-giallo-200);\n    --nc-giallo-300: var(--nc-dark-giallo-300);\n    --nc-giallo-400: var(--nc-dark-giallo-400);\n    --nc-giallo-500: var(--nc-dark-giallo-500);\n    --nc-giallo-600: var(--nc-dark-giallo-600);\n    --nc-giallo-700: var(--nc-dark-giallo-700);\n    --nc-giallo-800: var(--nc-dark-giallo-800);\n    --nc-giallo-900: var(--nc-dark-giallo-900);\n    --nc-giallo-1000: var(--nc-dark-giallo-1000);\n    --nc-verde-100: var(--nc-dark-verde-100);\n    --nc-verde-200: var(--nc-dark-verde-200);\n    --nc-verde-300: var(--nc-dark-verde-300);\n    --nc-verde-400: var(--nc-dark-verde-400);\n    --nc-verde-500: var(--nc-dark-verde-500);\n    --nc-verde-600: var(--nc-dark-verde-600);\n    --nc-verde-700: var(--nc-dark-verde-700);\n    --nc-verde-800: var(--nc-dark-verde-800);\n    --nc-verde-900: var(--nc-dark-verde-900);\n    --nc-verde-1000: var(--nc-dark-verde-1000);\n    --nc-acqua-100: var(--nc-dark-acqua-100);\n    --nc-acqua-200: var(--nc-dark-acqua-200);\n    --nc-acqua-300: var(--nc-dark-acqua-300);\n    --nc-acqua-400: var(--nc-dark-acqua-400);\n    --nc-acqua-500: var(--nc-dark-acqua-500);\n    --nc-acqua-600: var(--nc-dark-acqua-600);\n    --nc-acqua-700: var(--nc-dark-acqua-700);\n    --nc-acqua-800: var(--nc-dark-acqua-800);\n    --nc-acqua-900: var(--nc-dark-acqua-900);\n    --nc-acqua-1000: var(--nc-dark-acqua-1000);\n    --nc-viola-100: var(--nc-dark-viola-100);\n    --nc-viola-200: var(--nc-dark-viola-200);\n    --nc-viola-300: var(--nc-dark-viola-300);\n    --nc-viola-400: var(--nc-dark-viola-400);\n    --nc-viola-500: var(--nc-dark-viola-500);\n    --nc-viola-600: var(--nc-dark-viola-600);\n    --nc-viola-700: var(--nc-dark-viola-700);\n    --nc-viola-800: var(--nc-dark-viola-800);\n    --nc-viola-900: var(--nc-dark-viola-900);\n    --nc-viola-1000: var(--nc-dark-viola-1000);\n    --nc-rosa-100: var(--nc-dark-rosa-100);\n    --nc-rosa-200: var(--nc-dark-rosa-200);\n    --nc-rosa-300: var(--nc-dark-rosa-300);\n    --nc-rosa-400: var(--nc-dark-rosa-400);\n    --nc-rosa-500: var(--nc-dark-rosa-500);\n    --nc-rosa-600: var(--nc-dark-rosa-600);\n    --nc-rosa-700: var(--nc-dark-rosa-700);\n    --nc-rosa-800: var(--nc-dark-rosa-800);\n    --nc-rosa-900: var(--nc-dark-rosa-900);\n    --nc-rosa-1000: var(--nc-dark-rosa-1000);\n    --nc-category-teal-soft: var(--nc-dark-category-teal-soft);\n    --nc-category-teal-deep: var(--nc-dark-category-teal-deep);\n    --nc-category-purple-soft: var(--nc-dark-category-purple-soft);\n    --nc-category-purple-deep: var(--nc-dark-category-purple-deep);\n    --nc-category-pink-soft: var(--nc-dark-category-pink-soft);\n    --nc-category-pink-deep: var(--nc-dark-category-pink-deep);\n    --nc-elevation-resting:\n      0px 0px 0px 1px rgb(100% 100% 100% / 0.145),\n      0px 1px 2px 0px rgb(0% 0% 0% / 0.16),\n      0px 0px 0px 1px rgb(0% 0% 0%);\n    --nc-elevation-raised:\n      0px 0px 0px 1px rgb(100% 100% 100% / 0.145),\n      0px 2px 2px 0px rgb(0% 0% 0% / 0.2),\n      0px 8px 8px -8px rgb(0% 0% 0% / 0.3),\n      0px 0px 0px 1px rgb(0% 0% 0%);\n    --nc-elevation-floating:\n      0px 0px 0px 1px rgb(100% 100% 100% / 0.145),\n      0px 4px 8px -4px rgb(0% 0% 0% / 0.4),\n      0px 16px 24px -8px rgb(0% 0% 0% / 0.5),\n      0px 0px 0px 1px rgb(0% 0% 0%);\n    --nc-elevation-modal:\n      0px 0px 0px 1px rgb(100% 100% 100% / 0.145),\n      0px 8px 16px -4px rgb(0% 0% 0% / 0.4),\n      0px 24px 32px -8px rgb(0% 0% 0% / 0.55),\n      0px 0px 0px 1px rgb(0% 0% 0%);\n  }\n}";
 export const brandWordmarkSvg = "<svg data-slot=\"brand-wordmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 858 150\" width=\"137\" height=\"24\" class=\"block h-6 w-auto\" role=\"img\" aria-label=\"nadicode\"><g fill=\"none\" stroke=\"currentColor\" stroke-width=\"18\"><path d=\"M9 150V100A41 41 0 0 1 91 100V150\"></path><circle cx=\"172\" cy=\"100\" r=\"41\"></circle><path d=\"M213 50V150\"></path><circle cx=\"294\" cy=\"100\" r=\"41\"></circle><path d=\"M335 0V150\"></path><path d=\"M375 50V150\"></path><path d=\"M484.99 71.01A41 41 0 1 0 484.99 128.99\"></path><circle cx=\"564\" cy=\"100\" r=\"41\"></circle><circle cx=\"686\" cy=\"100\" r=\"41\"></circle><path d=\"M727 0V150\"></path><path d=\"M767 100H849A41 41 0 1 0 839.41 126.35\"></path></g><circle cx=\"375\" cy=\"21\" r=\"14\" fill=\"var(--nc-logo-dot)\"></circle></svg>";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nadicodeai/ui",
-  "version": "12.1.100",
+  "version": "12.1.102",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -80,7 +80,7 @@
     "@base-ui/react": "^1.9.0",
     "@iconify-icons/logos": "^2.0.2",
     "@iconify/react": "^6.0.2",
-    "@nadicodeai/design-system": "12.1.100",
+    "@nadicodeai/design-system": "12.1.102",
     "@tanstack/react-table": "^9.2.8",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",