@nadicodeai/ui 12.1.137 → 12.1.139

package/dist/components/brand.d.ts

@@ -3,15 +3,15 @@ type BrandLogoProps = Omit<React.ComponentProps<"svg">, "aria-hidden" | "aria-la
     alt?: string;
     decoding?: React.ComponentProps<"img">["decoding"];
 };
-/** The plain n. Use it where the name does not fit. */
+/** The mark: the n, nadicode's logo. Use it where the company is recognised by its sign. */
 declare function BrandMark({ alt, className, width, height, decoding, ...props }: BrandLogoProps): React.JSX.Element;
-/** The company logo: nadicode in full. Use it wherever the company is named. */
 /**
- * The company logo: nadicode in full.
+ * The wordmark: nadicode in full.
  *
  * @family Status
- * @when Wherever the company is named by its logo: the Portal's sidebar, the website's header, a
- * footer. `BrandMark`, the plain n, where the name does not fit.
+ * @when Wherever the company is named: the Portal's sidebar, the website's header, a footer.
+ * `BrandMark`, the n, where the company is recognised by its sign or the name does not fit; never
+ * the two side by side.
  * @instead A product's own mark (Nadia, Alveare) is that product's. A platform's is `PlatformMark`.
  * The company named in a sentence is text.
  * @behaviour The letters take the text colour of what they sit in, so one form serves every ground.

package/dist/components/brand.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"brand.d.ts","sourceRoot":"","sources":["../../src/components/brand.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,KAAK,cAAc,GAAG,IAAI,CACxB,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAC3B,aAAa,GAAG,YAAY,GAAG,UAAU,GAAG,MAAM,CACnD,GAAG;IACF,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC;CACpD,CAAC;AAwCF,uDAAuD;AACvD,iBAAS,SAAS,CAAC,EACjB,GAAgB,EAChB,SAAS,EACT,KAAU,EACV,MAAW,EACX,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,qBAkBhB;AAED,gFAAgF;AAChF;;;;;;;;;;;;;GAaG;AACH,iBAAS,aAAa,CAAC,EACrB,GAAgB,EAChB,SAAS,EACT,KAAW,EACX,MAAW,EACX,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,qBAkBhB;AAED,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,CAAC"}
+{"version":3,"file":"brand.d.ts","sourceRoot":"","sources":["../../src/components/brand.tsx"],"names":[],"mappings":"AASA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,KAAK,cAAc,GAAG,IAAI,CACxB,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAC3B,aAAa,GAAG,YAAY,GAAG,UAAU,GAAG,MAAM,CACnD,GAAG;IACF,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC;CACpD,CAAC;AAwCF,4FAA4F;AAC5F,iBAAS,SAAS,CAAC,EACjB,GAAgB,EAChB,SAAS,EACT,KAAU,EACV,MAAW,EACX,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,qBAkBhB;AAED;;;;;;;;;;;;;;GAcG;AACH,iBAAS,aAAa,CAAC,EACrB,GAAgB,EAChB,SAAS,EACT,KAAW,EACX,MAAW,EACX,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,cAAc,qBAkBhB;AAED,OAAO,EAAE,SAAS,EAAE,aAAa,EAAE,CAAC"}

package/dist/components/brand.js

@@ -28,19 +28,19 @@ const BRAND_PAINTS = { ink: "currentColor", dot: "var(--nc-logo-dot)" };
 function resolved(geometry) {
     return resolveLogoGeometry(geometry, { paints: BRAND_PAINTS });
 }
-/** The plain n. Use it where the name does not fit. */
+/** The mark: the n, nadicode's logo. Use it where the company is recognised by its sign. */
 function BrandMark({ alt = "nadicode", className, width = 32, height = 32, decoding, ...props }) {
     void decoding;
     const geometry = resolved(logoMarkGeometry);
     return (_jsx("svg", { "data-slot": "brand-mark", xmlns: "http://www.w3.org/2000/svg", viewBox: geometry.viewBox, width: width, height: height, className: cn("block size-6", className), ...accessibilityProps(alt), ...props, children: renderGeometryNodes(geometry.nodes) }));
 }
-/** The company logo: nadicode in full. Use it wherever the company is named. */
 /**
- * The company logo: nadicode in full.
+ * The wordmark: nadicode in full.
  *
  * @family Status
- * @when Wherever the company is named by its logo: the Portal's sidebar, the website's header, a
- * footer. `BrandMark`, the plain n, where the name does not fit.
+ * @when Wherever the company is named: the Portal's sidebar, the website's header, a footer.
+ * `BrandMark`, the n, where the company is recognised by its sign or the name does not fit; never
+ * the two side by side.
  * @instead A product's own mark (Nadia, Alveare) is that product's. A platform's is `PlatformMark`.
  * The company named in a sentence is text.
  * @behaviour The letters take the text colour of what they sit in, so one form serves every ground.

package/dist/components/catalog-entry.d.ts

@@ -6,8 +6,9 @@ import type { PageCommand } from "./page-actions.js";
 import type { RowMessage } from "../internal/row-message.js";
 export type { RowMessage };
 /**
- * The line icon a catalog entry names. A name outside `CATALOG_ICONS`, or
- * none, takes its kind's own icon, the one the Skills or Plugins section has.
+ * The line icon a catalog entry names. A name outside `CATALOG_ICONS`, none,
+ * or the sparkle, which no product draws for an entry, takes its kind's own
+ * icon, the one the Skills or Plugins section has.
  */
 export declare function catalogIcon(name: string | null | undefined, kind: "skill" | "plugin"): LucideIcon;
 export type CatalogEntryAdd = PageCommand & {
@@ -23,13 +24,13 @@ export type CatalogEntryAdd = PageCommand & {
  * @family Data
  * @when A reusable thing a person can add: a skill, a plugin or an app, on a Library shelf (`LibraryShelf`) or in the drawer that adds one to an Agent (`CatalogDrawer`).
  * @instead A record the person already holds is a row of its collection (`CollectionPage`). An Agent template is its `AgentCard`. Figures compared across entries are a `DataTable`.
- * @behaviour The kind's tile at 40: purple for a skill, blue for a plugin, an app's own logo. The name is the link to its own page. One Add control, outline with a leading plus; once held, a muted check and `added`'s word take its place. A menu of one command that is not destructive, with no Add, is that command's outline button; otherwise the three dots. A failed or refused add puts its message in the line's place, with its retry before the entry's own controls.
+ * @behaviour The kind's tile at 40: a skill's own icon on the neutral ringed tile, a plugin's on blue, an app's own logo. The name is the link to its own page. One Add control, outline with a leading plus; once held, a muted check and `added`'s word take its place. A menu of one command that is not destructive, with no Add, is that command's outline button; otherwise the three dots. A failed or refused add puts its message in the line's place, with its retry before the entry's own controls.
  * @words The name as the catalogue gives it; one line saying what it does, a sentence: "Classifies incoming requests and prepares the next step." The control is a verb: "Add".
  * @access The tile is decorative; the name is the link's text. A failed add's message is announced as an alert.
  */
 export type CatalogEntryProps = {
     id: string;
-    /** The kind's tile at 40: { kind: "record", icon: catalogIcon(name, "skill"), tone: "skill" }, or an app's logo. */
+    /** The kind's tile at 40: { kind: "record", icon: catalogIcon(name, "skill") }, or an app's logo. */
     mark: IdentityMarkProps;
     name: string;
     link?: {

package/dist/components/catalog-entry.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"catalog-entry.d.ts","sourceRoot":"","sources":["../../src/components/catalog-entry.ts"],"names":[],"mappings":"AAAA,OAAO,EAaL,KAAK,UAAU,EAiBhB,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAE5D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AACpE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAC7D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAEzD,YAAY,EAAE,UAAU,EAAE,CAAC;AAwC3B;;;GAGG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,EAAE,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,UAAU,CAEjG;AAED,MAAM,MAAM,eAAe,GAAG,WAAW,GAAG;IAC1C,yFAAyF;IACzF,KAAK,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;CAC3B,CAAC;AAEF;;;;;;;;;;GAUG;AACH,MAAM,MAAM,iBAAiB,GAAG;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,oHAAoH;IACpH,IAAI,EAAE,iBAAiB,CAAC;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE;QACL,IAAI,EAAE,MAAM,CAAC;QACb,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,GAAG;YAAE,IAAI,EAAE,MAAM,CAAA;SAAE,KAAK,SAAS,CAAC;KAC3E,CAAC;IACF,WAAW,EAAE,SAAS,CAAC;IACvB,4DAA4D;IAC5D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,GAAG,CAAC,EAAE,eAAe,CAAC;IACtB,IAAI,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,SAAS,WAAW,EAAE,CAAA;KAAE,CAAC;IAC3D,4EAA4E;IAC5E,KAAK,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,SAAS,iBAAiB,EAAE,CAAC;CACvC,CAAC"}
+{"version":3,"file":"catalog-entry.d.ts","sourceRoot":"","sources":["../../src/components/catalog-entry.ts"],"names":[],"mappings":"AAAA,OAAO,EAaL,KAAK,UAAU,EAiBhB,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEvD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAE5D,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,4BAA4B,CAAC;AACpE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,2BAA2B,CAAC;AAC7D,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAEzD,YAAY,EAAE,UAAU,EAAE,CAAC;AAwC3B;;;;GAIG;AACH,wBAAgB,WAAW,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,EAAE,IAAI,EAAE,OAAO,GAAG,QAAQ,GAAG,UAAU,CAEjG;AAED,MAAM,MAAM,eAAe,GAAG,WAAW,GAAG;IAC1C,yFAAyF;IACzF,KAAK,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAA;KAAE,CAAC;CAC3B,CAAC;AAEF;;;;;;;;;;GAUG;AACH,MAAM,MAAM,iBAAiB,GAAG;IAC9B,EAAE,EAAE,MAAM,CAAC;IACX,qGAAqG;IACrG,IAAI,EAAE,iBAAiB,CAAC;IACxB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE;QACL,IAAI,EAAE,MAAM,CAAC;QACb,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,GAAG;YAAE,IAAI,EAAE,MAAM,CAAA;SAAE,KAAK,SAAS,CAAC;KAC3E,CAAC;IACF,WAAW,EAAE,SAAS,CAAC;IACvB,4DAA4D;IAC5D,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,GAAG,CAAC,EAAE,eAAe,CAAC;IACtB,IAAI,CAAC,EAAE;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,QAAQ,EAAE,SAAS,WAAW,EAAE,CAAA;KAAE,CAAC;IAC3D,4EAA4E;IAC5E,KAAK,CAAC,EAAE,UAAU,GAAG,IAAI,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,cAAc,GAAG;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,EAAE,SAAS,iBAAiB,EAAE,CAAC;CACvC,CAAC"}

package/dist/components/catalog-entry.js

@@ -32,9 +32,10 @@ function isCatalogIcon(name) {
     return Object.hasOwn(ICONS, name);
 }
 /**
- * The line icon a catalog entry names. A name outside `CATALOG_ICONS`, or
- * none, takes its kind's own icon, the one the Skills or Plugins section has.
+ * The line icon a catalog entry names. A name outside `CATALOG_ICONS`, none,
+ * or the sparkle, which no product draws for an entry, takes its kind's own
+ * icon, the one the Skills or Plugins section has.
  */
 export function catalogIcon(name, kind) {
-    return name && isCatalogIcon(name) ? ICONS[name] : FALLBACK_ICONS[kind];
+    return name && name !== "sparkles" && isCatalogIcon(name) ? ICONS[name] : FALLBACK_ICONS[kind];
 }

package/dist/components/empty-state.d.ts

@@ -2,7 +2,7 @@ import { type ReactElement } from "react";
 import { type EmptyScope } from "../internal/empty.js";
 import { type CopyButtonProps } from "./copy-button.js";
 import type { EmptyArt } from "./empty-art.js";
-import { type PageCommand } from "./page-actions.js";
+import { type PageCommand, type PagePrimaryCommand } from "./page-actions.js";
 import { type ResolvedMessage } from "./product-message.js";
 /** A link that leaves for the product's documentation: a command drawn from the product's router link, so it carries `link`, never `onClick`. */
 export type EmptyStateDocsLink = Extract<PageCommand, {
@@ -23,7 +23,7 @@ export type EmptyStateProps = {
     description: string;
     picture: EmptyArt;
     /** The action that fills it, only when this viewer can add. */
-    action?: PageCommand;
+    action?: PagePrimaryCommand;
     /** Where the product explains this section: the one muted link under the action. */
     docs?: EmptyStateDocsLink;
 } | {

package/dist/components/empty-state.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"empty-state.d.ts","sourceRoot":"","sources":["../../src/components/empty-state.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,YAAY,EAAqC,MAAM,OAAO,CAAC;AAE7E,OAAO,EAOL,KAAK,UAAU,EAEhB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AAEjE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAE,KAAK,WAAW,EAAqB,MAAM,gBAAgB,CAAC;AACrE,OAAO,EAAmB,KAAK,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAE1E,iJAAiJ;AACjJ,MAAM,MAAM,kBAAkB,GAAG,OAAO,CAAC,WAAW,EAAE;IAAE,IAAI,EAAE,YAAY,CAAA;CAAE,CAAC,CAAC;AAE9E,uGAAuG;AACvG,MAAM,MAAM,mBAAmB,GAAG;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,GAAG,IAAI,CACxD,eAAe,EACf,OAAO,GAAG,WAAW,GAAG,aAAa,GAAG,iBAAiB,CAC1D,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,+GAA+G;IAC/G,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,wFAAwF;IACxF,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;CACtB,GAAG,CACA;IACE,IAAI,EAAE,UAAU,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,QAAQ,CAAC;IAClB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,oFAAoF;IACpF,IAAI,CAAC,EAAE,kBAAkB,CAAC;CAC3B,GACD;IAAE,IAAI,EAAE,YAAY,CAAC;IAAC,OAAO,EAAE,MAAM,CAAA;CAAE,GACvC;IAAE,IAAI,EAAE,WAAW,CAAC;IAAC,OAAO,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,WAAW,CAAA;CAAE,GAC1D;IAAE,IAAI,EAAE,SAAS,CAAC;IAAC,OAAO,EAAE,MAAM,CAAA;CAAE,GACpC;IACE,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,mEAAmE;IACnE,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,uGAAuG;IACvG,KAAK,CAAC,EAAE,OAAO,CAAC,UAAU,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;CAC9C,GACD;IACE,IAAI,EAAE,QAAQ,CAAC;IACf,OAAO,EAAE,eAAe,CAAC;IACzB,mHAAmH;IACnH,SAAS,CAAC,EAAE,mBAAmB,CAAC;CACjC,CACJ,CAAC;AAEF,sFAAsF;AACtF,MAAM,MAAM,cAAc,CAAC,CAAC,SAAS,eAAe,CAAC,MAAM,CAAC,IAAI,IAAI,CAClE,OAAO,CAAC,eAAe,EAAE;IAAE,IAAI,EAAE,CAAC,CAAA;CAAE,CAAC,EACrC,OAAO,GAAG,cAAc,CACzB,CAAC;AAEF;;;;;;;;;;GAUG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,+BAwFhD"}
+{"version":3,"file":"empty-state.d.ts","sourceRoot":"","sources":["../../src/components/empty-state.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,YAAY,EAAqC,MAAM,OAAO,CAAC;AAE7E,OAAO,EAOL,KAAK,UAAU,EAEhB,MAAM,kBAAkB,CAAC;AAC1B,OAAO,EAAc,KAAK,eAAe,EAAE,MAAM,eAAe,CAAC;AAEjE,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAE,KAAK,WAAW,EAAqB,KAAK,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AAC9F,OAAO,EAAmB,KAAK,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAE1E,iJAAiJ;AACjJ,MAAM,MAAM,kBAAkB,GAAG,OAAO,CAAC,WAAW,EAAE;IAAE,IAAI,EAAE,YAAY,CAAA;CAAE,CAAC,CAAC;AAE9E,uGAAuG;AACvG,MAAM,MAAM,mBAAmB,GAAG;IAAE,KAAK,EAAE,MAAM,CAAA;CAAE,GAAG,IAAI,CACxD,eAAe,EACf,OAAO,GAAG,WAAW,GAAG,aAAa,GAAG,iBAAiB,CAC1D,CAAC;AAEF,MAAM,MAAM,eAAe,GAAG;IAC5B,+GAA+G;IAC/G,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,wFAAwF;IACxF,YAAY,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;CACtB,GAAG,CACA;IACE,IAAI,EAAE,UAAU,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,QAAQ,CAAC;IAClB,+DAA+D;IAC/D,MAAM,CAAC,EAAE,kBAAkB,CAAC;IAC5B,oFAAoF;IACpF,IAAI,CAAC,EAAE,kBAAkB,CAAC;CAC3B,GACD;IAAE,IAAI,EAAE,YAAY,CAAC;IAAC,OAAO,EAAE,MAAM,CAAA;CAAE,GACvC;IAAE,IAAI,EAAE,WAAW,CAAC;IAAC,OAAO,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,WAAW,CAAA;CAAE,GAC1D;IAAE,IAAI,EAAE,SAAS,CAAC;IAAC,OAAO,EAAE,MAAM,CAAA;CAAE,GACpC;IACE,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,mEAAmE;IACnE,MAAM,CAAC,EAAE,WAAW,CAAC;IACrB,uGAAuG;IACvG,KAAK,CAAC,EAAE,OAAO,CAAC,UAAU,EAAE,MAAM,GAAG,MAAM,CAAC,CAAC;CAC9C,GACD;IACE,IAAI,EAAE,QAAQ,CAAC;IACf,OAAO,EAAE,eAAe,CAAC;IACzB,mHAAmH;IACnH,SAAS,CAAC,EAAE,mBAAmB,CAAC;CACjC,CACJ,CAAC;AAEF,sFAAsF;AACtF,MAAM,MAAM,cAAc,CAAC,CAAC,SAAS,eAAe,CAAC,MAAM,CAAC,IAAI,IAAI,CAClE,OAAO,CAAC,eAAe,EAAE;IAAE,IAAI,EAAE,CAAC,CAAA;CAAE,CAAC,EACrC,OAAO,GAAG,cAAc,CACzB,CAAC;AAEF;;;;;;;;;;GAUG;AACH,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,+BAwFhD"}

package/dist/components/identity-mark.d.ts

@@ -42,11 +42,11 @@ export type IdentityMarkProps = {
     image?: string;
 } | {
     kind: "record";
-    /** The kind's own icon, the one its section has in the navigation: Mail for a mailbox. */
+    /** The record's own icon when it names one, as a skill does in its hub card; otherwise its kind's, the one its section has in the navigation: Mail for a mailbox. */
     icon: IconComponent;
     /** A catalogue kind's ground; neutral is the ringed card ground. */
-    tone?: "neutral" | "skill" | "plugin" | "teal";
-    /** The record's own object picture, a transparent image drawn on its kind's ground in place of the icon. */
+    tone?: "neutral" | "plugin" | "teal";
+    /** The record's own object picture, a transparent image drawn on its kind's ground in place of the icon at 64; smaller marks draw the icon. */
     picture?: string;
 });
 /**
@@ -58,7 +58,7 @@ export type IdentityMarkProps = {
  * @family Status
  * @when The first thing in a record's row (32), at the head of its object page (64), in a feed or a sidebar identity line (24), on a Library entry (40), for the company at the top of Nadia's list (28): wherever it tells a person which thing they are looking at.
  * @instead An icon beside a card's title, a KPI's label or a section heading only repeats the words and is left out. A picture for a first use or a whole-page moment is the empty state's or the page's own. A model is its `ModelIdentity`; a maker's mark beside a model's name in a list of models is `ModelMark` at 24.
- * @behaviour Static, except an Agent's orb, which moves with her state. An Agent is always her real orb from the orb engine, at the largest orb size not above the mark's, with no tile and no ring, never an avatar or a painted circle, and `frame` lets the product wrap that orb, such as in the transition that carries her to her page; an app keeps its own logo in its bordered tile on the page ground, or its first letter when it has no logo; a record that belongs to a model maker, such as a key held at that maker, is the maker's `ModelMark` at the mark's size, with its initials when LobeHub has no mark for it; a company is its own logo, contained whole in its original colours and proportions on a dark ringed tile, as Vercel shows a project's favicon, and until a logo is found, or when the stored logo does not load, its initials in white on that same tile, so a found logo only replaces the letters; a company's mark is the same whatever its standing and whichever directory opened it, and a Partner is said in words where its standing matters, never by a colour; a person is their picture, then their initials, in a round mark; a record with its own object picture, such as a Library skill or plugin, draws that picture on its kind's ground; a record with no picture of its own takes its kind's own icon, the same icon its section has in the navigation (Mail for a mailbox, a server for an MCP server, a key for a password), in a ringed tile on the card ground; a Library skill takes the purple category ground with the Skills icon and a plugin the `info-soft` ground with the Plugins icon, both without a ring, so the ground says which kind it is, and an entry that has its own object picture draws it on that ground in the icon's place. A record tile takes `{rounded.sm}` (6 px) corners, `{rounded.md}` (8 px) at 40 and 64; a company's tile and an app's tile take `{rounded.md}` at every size.
+ * @behaviour Static, except an Agent's orb, which moves with her state. An Agent is always her real orb from the orb engine, at the largest orb size not above the mark's, with no tile and no ring, never an avatar or a painted circle, and `frame` lets the product wrap that orb, such as in the transition that carries her to her page; an app keeps its own logo in its bordered tile on the page ground, or its first letter when it has no logo; a record that belongs to a model maker, such as a key held at that maker, is the maker's `ModelMark` at the mark's size, with its initials when LobeHub has no mark for it; a company is its own logo, contained whole in its original colours and proportions on a dark ringed tile, as Vercel shows a project's favicon, and until a logo is found, or when the stored logo does not load, its initials in white on that same tile, so a found logo only replaces the letters; a company's mark is the same whatever its standing and whichever directory opened it, and a Partner is said in words where its standing matters, never by a colour; a person is their picture, then their initials, in a round mark; a record with no picture of its own takes its kind's own icon, the same icon its section has in the navigation (Mail for a mailbox, a server for an MCP server, a key for a password), in a ringed tile on the card ground; a skill takes the icon its hub card names, and the Skills icon when it names none, on that same neutral ringed tile, so the icon alone tells one skill from another and no colour stands for the kind; a plugin takes the `info-soft` ground with the Plugins icon, without a ring; a record's own object picture, such as a Library skill's or plugin's, is drawn only at 64, at the head of its own page, on its kind's ground in the icon's place, because at a row's size its detail does not read. A record tile takes `{rounded.sm}` (6 px) corners, `{rounded.md}` (8 px) at 40 and 64; a company's tile and an app's tile take `{rounded.md}` at every size.
  * @words None of its own: the record's name stands beside it. Initials stand for a company or a person: the first letters of the name's first two words. An app with no logo takes the first letter of its name as a monogram, a model maker with no mark the initials of its slug, and no other kind takes letters.
  * @access Decorative beside the record's name. Alone, as in a narrow rail, `label` names it.
  */

package/dist/components/identity-mark.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"identity-mark.d.ts","sourceRoot":"","sources":["../../src/components/identity-mark.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEnF,OAAO,EAEL,KAAK,cAAc,EAEnB,KAAK,aAAa,EACnB,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAMnE,MAAM,MAAM,gBAAgB,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAE3D,qHAAqH;AACrH,MAAM,MAAM,aAAa,GAAG,aAAa,CAAC;IACxC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC;CAC5C,CAAC,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG;IAC9B,4GAA4G;IAC5G,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB,4GAA4G;IAC5G,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,CACA;IACE,IAAI,EAAE,OAAO,CAAC;IACd,GAAG,EAAE;QAAE,IAAI,EAAE,cAAc,CAAC;QAAC,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;QAAC,KAAK,CAAC,EAAE,aAAa,CAAA;KAAE,CAAC;IACrF,kGAAkG;IAClG,KAAK,CAAC,EAAE,CAAC,GAAG,EAAE,YAAY,KAAK,SAAS,CAAC;CAC1C,GACD,CAAC;IAAE,IAAI,EAAE,KAAK,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,GAAG,YAAY,CAAC,GAC7C;IACE,IAAI,EAAE,SAAS,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,GACD;IACE,IAAI,EAAE,OAAO,CAAC;IACd,wFAAwF;IACxF,MAAM,EAAE,MAAM,CAAC;CAChB,GACD;IAAE,IAAI,EAAE,QAAQ,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,GAChD;IACE,IAAI,EAAE,QAAQ,CAAC;IACf,0FAA0F;IAC1F,IAAI,EAAE,aAAa,CAAC;IACpB,oEAAoE;IACpE,IAAI,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,QAAQ,GAAG,MAAM,CAAC;IAC/C,4GAA4G;IAC5G,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CACJ,CAAC;AA6DF;;;;;;;;;;;;GAYG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,SAAS,CA6DhE"}
+{"version":3,"file":"identity-mark.d.ts","sourceRoot":"","sources":["../../src/components/identity-mark.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,aAAa,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAEnF,OAAO,EAEL,KAAK,cAAc,EAEnB,KAAK,aAAa,EACnB,MAAM,wBAAwB,CAAC;AAChC,OAAO,EAAW,KAAK,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAMnE,MAAM,MAAM,gBAAgB,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC;AAE3D,qHAAqH;AACrH,MAAM,MAAM,aAAa,GAAG,aAAa,CAAC;IACxC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,aAAa,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC;CAC5C,CAAC,CAAC;AAEH,MAAM,MAAM,iBAAiB,GAAG;IAC9B,4GAA4G;IAC5G,IAAI,CAAC,EAAE,gBAAgB,CAAC;IACxB,4GAA4G;IAC5G,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,GAAG,CACA;IACE,IAAI,EAAE,OAAO,CAAC;IACd,GAAG,EAAE;QAAE,IAAI,EAAE,cAAc,CAAC;QAAC,KAAK,CAAC,EAAE,aAAa,CAAC,OAAO,CAAC,CAAC;QAAC,KAAK,CAAC,EAAE,aAAa,CAAA;KAAE,CAAC;IACrF,kGAAkG;IAClG,KAAK,CAAC,EAAE,CAAC,GAAG,EAAE,YAAY,KAAK,SAAS,CAAC;CAC1C,GACD,CAAC;IAAE,IAAI,EAAE,KAAK,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,GAAG,YAAY,CAAC,GAC7C;IACE,IAAI,EAAE,SAAS,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,GACD;IACE,IAAI,EAAE,OAAO,CAAC;IACd,wFAAwF;IACxF,MAAM,EAAE,MAAM,CAAC;CAChB,GACD;IAAE,IAAI,EAAE,QAAQ,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,CAAC,EAAE,MAAM,CAAA;CAAE,GAChD;IACE,IAAI,EAAE,QAAQ,CAAC;IACf,qKAAqK;IACrK,IAAI,EAAE,aAAa,CAAC;IACpB,oEAAoE;IACpE,IAAI,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,MAAM,CAAC;IACrC,+IAA+I;IAC/I,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CACJ,CAAC;AA4DF;;;;;;;;;;;;GAYG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,GAAG,SAAS,CA6DhE"}

package/dist/components/identity-mark.js

@@ -15,7 +15,6 @@ const MEASURES = {
 };
 const TONES = {
     neutral: "bg-card text-muted-foreground ring-1 ring-border ring-inset",
-    skill: "bg-category-purple text-category-purple-foreground",
     plugin: "bg-info-soft text-info-soft-foreground",
     teal: "bg-category-teal text-category-teal-foreground",
 };
@@ -39,7 +38,7 @@ function RecordTile({ label, size, tone, children, }) {
  * @family Status
  * @when The first thing in a record's row (32), at the head of its object page (64), in a feed or a sidebar identity line (24), on a Library entry (40), for the company at the top of Nadia's list (28): wherever it tells a person which thing they are looking at.
  * @instead An icon beside a card's title, a KPI's label or a section heading only repeats the words and is left out. A picture for a first use or a whole-page moment is the empty state's or the page's own. A model is its `ModelIdentity`; a maker's mark beside a model's name in a list of models is `ModelMark` at 24.
- * @behaviour Static, except an Agent's orb, which moves with her state. An Agent is always her real orb from the orb engine, at the largest orb size not above the mark's, with no tile and no ring, never an avatar or a painted circle, and `frame` lets the product wrap that orb, such as in the transition that carries her to her page; an app keeps its own logo in its bordered tile on the page ground, or its first letter when it has no logo; a record that belongs to a model maker, such as a key held at that maker, is the maker's `ModelMark` at the mark's size, with its initials when LobeHub has no mark for it; a company is its own logo, contained whole in its original colours and proportions on a dark ringed tile, as Vercel shows a project's favicon, and until a logo is found, or when the stored logo does not load, its initials in white on that same tile, so a found logo only replaces the letters; a company's mark is the same whatever its standing and whichever directory opened it, and a Partner is said in words where its standing matters, never by a colour; a person is their picture, then their initials, in a round mark; a record with its own object picture, such as a Library skill or plugin, draws that picture on its kind's ground; a record with no picture of its own takes its kind's own icon, the same icon its section has in the navigation (Mail for a mailbox, a server for an MCP server, a key for a password), in a ringed tile on the card ground; a Library skill takes the purple category ground with the Skills icon and a plugin the `info-soft` ground with the Plugins icon, both without a ring, so the ground says which kind it is, and an entry that has its own object picture draws it on that ground in the icon's place. A record tile takes `{rounded.sm}` (6 px) corners, `{rounded.md}` (8 px) at 40 and 64; a company's tile and an app's tile take `{rounded.md}` at every size.
+ * @behaviour Static, except an Agent's orb, which moves with her state. An Agent is always her real orb from the orb engine, at the largest orb size not above the mark's, with no tile and no ring, never an avatar or a painted circle, and `frame` lets the product wrap that orb, such as in the transition that carries her to her page; an app keeps its own logo in its bordered tile on the page ground, or its first letter when it has no logo; a record that belongs to a model maker, such as a key held at that maker, is the maker's `ModelMark` at the mark's size, with its initials when LobeHub has no mark for it; a company is its own logo, contained whole in its original colours and proportions on a dark ringed tile, as Vercel shows a project's favicon, and until a logo is found, or when the stored logo does not load, its initials in white on that same tile, so a found logo only replaces the letters; a company's mark is the same whatever its standing and whichever directory opened it, and a Partner is said in words where its standing matters, never by a colour; a person is their picture, then their initials, in a round mark; a record with no picture of its own takes its kind's own icon, the same icon its section has in the navigation (Mail for a mailbox, a server for an MCP server, a key for a password), in a ringed tile on the card ground; a skill takes the icon its hub card names, and the Skills icon when it names none, on that same neutral ringed tile, so the icon alone tells one skill from another and no colour stands for the kind; a plugin takes the `info-soft` ground with the Plugins icon, without a ring; a record's own object picture, such as a Library skill's or plugin's, is drawn only at 64, at the head of its own page, on its kind's ground in the icon's place, because at a row's size its detail does not read. A record tile takes `{rounded.sm}` (6 px) corners, `{rounded.md}` (8 px) at 40 and 64; a company's tile and an app's tile take `{rounded.md}` at every size.
  * @words None of its own: the record's name stands beside it. Initials stand for a company or a person: the first letters of the name's first two words. An app with no logo takes the first letter of its name as a monogram, a model maker with no mark the initials of its slug, and no other kind takes letters.
  * @access Decorative beside the record's name. Alone, as in a narrow rail, `label` names it.
  */
@@ -60,6 +59,6 @@ export function IdentityMark(props) {
         case "company":
             return (_jsx(CompanyMark, { initialsSize: measures.initials, logo: props.logo, name: props.name, naming: naming(props.label), size: size }));
         case "record":
-            return (_jsx(RecordTile, { label: props.label, size: size, tone: props.tone ?? "neutral", children: props.picture ? (_jsx("img", { alt: "", className: "size-[84%] object-contain", "data-slot": "identity-mark-picture", src: props.picture })) : (_jsx(props.icon, { "aria-hidden": "true", size: measures.icon })) }));
+            return (_jsx(RecordTile, { label: props.label, size: size, tone: props.tone ?? "neutral", children: props.picture && size === 64 ? (_jsx("img", { alt: "", className: "size-[84%] object-contain", "data-slot": "identity-mark-picture", src: props.picture })) : (_jsx(props.icon, { "aria-hidden": "true", size: measures.icon })) }));
     }
 }

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

@@ -33,8 +33,7 @@ export type PendingWord = {
     pending?: false | undefined;
     pendingLabel?: string | undefined;
 };
-/** A command drawn as a button: on the title row, in an empty state, in a row. Its icon leads the label. */
-export type PageCommand = PageCommandAction & PendingWord & {
+type PageCommandFace = PendingWord & {
     label: string;
     icon?: ReactElement | undefined;
     /** Read instead of the label when the label alone does not name the target: "Sign in to Notion". */
@@ -43,6 +42,20 @@ export type PageCommand = PageCommandAction & PendingWord & {
     external?: boolean | undefined;
     disabled?: boolean | undefined;
 };
+/** A command drawn as a button: on the title row, in an empty state, in a row. Its icon leads the label. */
+export type PageCommand = PageCommandAction & PageCommandFace;
+/**
+ * A page's main command that comes in a few kinds of the same job, such as Add source's folder,
+ * documents or web page: the button opens a menu of them, as Vercel's "Add New…" does. Only the
+ * page's primary and a first use's action take it.
+ */
+export type PageChoicesCommand = PageCommandFace & {
+    choices: readonly [MenuCommand, MenuCommand, ...MenuCommand[]];
+    onClick?: never;
+    link?: never;
+    render?: never;
+};
+export type PagePrimaryCommand = PageCommand | PageChoicesCommand;
 /** The page's three dots, which open only for two commands or more. */
 export type PageMenu = Omit<RecordMenu, "commands"> & {
     commands: readonly [MenuCommand, MenuCommand, ...MenuCommand[]];
@@ -51,12 +64,12 @@ export type PageActionsProps = {
     /** An overview's reading period, first on the title row: a period `Select` or `DateRangeControl`. */
     period?: ReactElement | undefined;
     secondary?: PageCommand | undefined;
-    primary?: PageCommand | undefined;
+    primary?: PagePrimaryCommand | undefined;
     menu?: PageMenu | undefined;
 };
 type CommandVariant = "default" | "outline" | "ghost" | "link";
 export declare function PageCommandButton({ command, shape, size, variant, }: {
-    command: PageCommand;
+    command: PagePrimaryCommand;
     shape?: TextButtonProps["shape"];
     size?: TextButtonProps["size"];
     variant: CommandVariant;
@@ -85,8 +98,8 @@ export declare function PageActionsSlot(): import("react").JSX.Element;
  * @family Actions
  * @when The actions of a collection, an object or an overview page, on the title's row at its trailing edge. A Configuration page has none: each section saves from its footer.
  * @instead A row's actions are the row's one button and its `ActionMenu`. A collection toolbar holds search and filters, never a page action.
- * @behaviour Takes `period`, `secondary`, `primary` and `menu` and draws their order and variants itself: the period, outline, default, then the three dots last. The menu needs two commands or more; a single extra command is the secondary. A destination outside the product ends in the arrow. A running command (`pending`) keeps its place and icon, says its pending word and holds, and the type requires `pendingLabel` whenever `pending` is set. A command here is never destructive or warning: those sit in the danger zone of the page, in a card.
- * @words The primary is the page's main job as verb and noun: "Invite member", "New Agent". The pending word is its -ing form: "Inviting member". The menu names the page's record at its top and keeps the destructive command last, after a divider.
+ * @behaviour Takes `period`, `secondary`, `primary` and `menu` and draws their order and variants itself: the period, outline, default, then the three dots last. The menu needs two commands or more; a single extra command is the secondary. A primary whose job comes in a few kinds takes `choices`: its button opens a menu of them aligned to its end, each with its icon, as Vercel's "Add New…" does; a kind that needs its own fields opens its dialog from its row. A destination outside the product ends in the arrow. A running command (`pending`) keeps its place and icon, says its pending word and holds, and the type requires `pendingLabel` whenever `pending` is set. A command here is never destructive or warning: those sit in the danger zone of the page, in a card.
+ * @words The primary is the page's main job as verb and noun: "Invite member", "New Agent". Its choices are the kinds, as nouns: "Folder", "Documents", "Web page". The pending word is its -ing form: "Inviting member". The menu names the page's record at its top and keeps the destructive command last, after a divider.
  * @access DOM order is visual order. A command whose label does not name its target carries `accessibleName`. A running command is `aria-busy` and keeps focus. The three dots carry "More for {record}"; the menu returns focus to them when it closes.
  */
 export declare function PageActions(props: PageActionsProps): import("react").JSX.Element | null;

package/dist/components/page-actions.d.ts.map

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

package/dist/components/page-actions.js

@@ -4,8 +4,10 @@ import { ArrowUpRight } from "lucide-react";
 import { createContext, useContext, useEffect, useId, useState, } from "react";
 import { createPortal } from "react-dom";
 import { createStore, useStore } from "zustand";
+import { MenuCommandRow } from "../internal/record-menu-items.js";
 import { ActionMenu } from "./action-menu.js";
 import { Button, ButtonLink } from "./button.js";
+import { DropdownMenu, DropdownMenuContent, DropdownMenuTrigger } from "./dropdown-menu.js";
 export function PageCommandButton({ command, shape, size, variant, }) {
     const look = {
         "aria-label": command.accessibleName,
@@ -24,6 +26,9 @@ export function PageCommandButton({ command, shape, size, variant, }) {
     if (command.render) {
         return (_jsx(Button, { ...look, render: command.render, children: command.label }));
     }
+    if ("choices" in command && command.choices) {
+        return (_jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { render: _jsx(Button, { ...look }), children: command.label }), _jsx(DropdownMenuContent, { align: "end", children: command.choices.map((choice) => (_jsx(MenuCommandRow, { command: choice }, choice.label))) })] }));
+    }
     return (_jsx(Button, { ...look, onClick: command.onClick, type: "button", children: command.label }));
 }
 /** The row of a page's actions where it stands, for a page whose header is its own card. */
@@ -69,8 +74,8 @@ export function PageActionsSlot() {
  * @family Actions
  * @when The actions of a collection, an object or an overview page, on the title's row at its trailing edge. A Configuration page has none: each section saves from its footer.
  * @instead A row's actions are the row's one button and its `ActionMenu`. A collection toolbar holds search and filters, never a page action.
- * @behaviour Takes `period`, `secondary`, `primary` and `menu` and draws their order and variants itself: the period, outline, default, then the three dots last. The menu needs two commands or more; a single extra command is the secondary. A destination outside the product ends in the arrow. A running command (`pending`) keeps its place and icon, says its pending word and holds, and the type requires `pendingLabel` whenever `pending` is set. A command here is never destructive or warning: those sit in the danger zone of the page, in a card.
- * @words The primary is the page's main job as verb and noun: "Invite member", "New Agent". The pending word is its -ing form: "Inviting member". The menu names the page's record at its top and keeps the destructive command last, after a divider.
+ * @behaviour Takes `period`, `secondary`, `primary` and `menu` and draws their order and variants itself: the period, outline, default, then the three dots last. The menu needs two commands or more; a single extra command is the secondary. A primary whose job comes in a few kinds takes `choices`: its button opens a menu of them aligned to its end, each with its icon, as Vercel's "Add New…" does; a kind that needs its own fields opens its dialog from its row. A destination outside the product ends in the arrow. A running command (`pending`) keeps its place and icon, says its pending word and holds, and the type requires `pendingLabel` whenever `pending` is set. A command here is never destructive or warning: those sit in the danger zone of the page, in a card.
+ * @words The primary is the page's main job as verb and noun: "Invite member", "New Agent". Its choices are the kinds, as nouns: "Folder", "Documents", "Web page". The pending word is its -ing form: "Inviting member". The menu names the page's record at its top and keeps the destructive command last, after a divider.
  * @access DOM order is visual order. A command whose label does not name its target carries `accessibleName`. A running command is `aria-busy` and keeps focus. The three dots carry "More for {record}"; the menu returns focus to them when it closes.
  */
 export function PageActions(props) {

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

@@ -81,7 +81,7 @@ export type SavingSettingsSectionProps = SettingsSectionBase & SavingSection;
  * @family Compositions
  * @when One setting a person changes on a SettingsPage or as a section of an ObjectPage: Personal details, Company identity, Notifications. A typed value takes `save`; a switch or a short reversible choice applies at once through its own control's change, with no Save. Also a plan-gated feature, a delete card, one read-only value (an ID in a read-only mono InputGroup with its copy button, no Save), and a paid quantity (its stepper field, the price as the description, a two-fact summary under it).
  * @instead Read-only facts of an object are a SettingsFactsSection; a table or a list of records is a TableCard; Theme and Language live in the account menu; a record's edit in a list is a RowEditForm.
- * @behaviour "Groups related form controls inside a bordered card with optional footer actions." (https://vercel.com/geist/fieldset) Ours: one setting per card: a single SettingsField, the description its only help. A typed value (a name, a URL, a server, a port, a key) gets its own card. A semantic subgroup of related controls inside a field, such as radios or checkboxes, is a `FieldSet` with a `FieldLegend`. One more shape exists, declared by a part and never by classes at the call site. A card of several settings holds SettingsRows, label left and control right, only when every row is a switch or every row is a select. "Use Toggle for a single boolean setting where ON takes effect immediately, like `Password Protection` or `Auto-Cancel Builds`." (https://vercel.com/geist/toggle) "Pair with a form footer only when the setting needs an explicit `Save` step." (https://vercel.com/geist/toggle) "Disable Toggle only when the action is impossible (missing plan, locked policy); pair with helper text or a `Tooltip` that names the resolver." (https://vercel.com/geist/toggle) Ours: a switch never applies on change; it is a row of the card, a draft until the footer's Save, as Vercel's settings cards are. A switch blocked from above is shown off and disabled, the footer saying why and never a tooltip. Required: the title and the description. The header's actions stand at the title's right; on a card narrower than 28 rem they keep the title's row and the description runs under both, as Vercel's cards read on a phone, and when the title's longest word would not fit beside them they move under the title, so they never cover it. The footer's left line (`footerHint`, `save.hint`) is optional and specific to the card, never a generic line repeated on every card: a limit, what a value is for, a plan it needs, a link; absent, it is nothing, and a card with neither a line nor a button has no footer. Ours: `save`: a typed value, one card with its own Save in the footer, always visible. The section owns the changed state: Save stays disabled until a field differs from what is saved and says `pendingLabel` while saving with Cancel beside it; a completed save calls `saved`, and the product raises one toast from its catalogue ("Completion toasts follow `{Noun} {past-participle}`: `Blob deleted`, `Domain added`, `Environment variable saved`. Never include `successfully`; the action name implies it." https://vercel.com/geist/toast), and Save returns to disabled, with no saved state in the footer. Ours: the section never raises a toast itself. A failed save keeps every value and shows under its field, or above the footer when no field owns it. `tone` marks a state with a command (a failed payment, a trial ending): a 1px border and a footer tinted in the hue with its line in it, the line saying the condition in words; title, line, fields and buttons stay neutral, an outline secondary then a default primary. A button takes the hue of its command, not of the card: `destructive` (red) for a permanent loss (Delete), `warning` (amber) for a disruptive command that can be undone (Pause, Archive). A delete card is `tone="error"` with the object's summary as its body; an archive card is neutral with a `warning` button in the footer. "Use a Note for inline contextual feedback next to the field, card, or section it describes: a region change warning above a region picker, a rate-limit notice next to a usage gauge." (https://vercel.com/geist/note) "One Note per concept." (https://vercel.com/geist/note) Ours: a message about the fields inside is a MessageNotice in the body, the card staying neutral. "Disabled checkboxes still need a Tooltip naming the reason; a greyed box with no explanation reads as a bug." (https://vercel.com/geist/checkbox) Ours: `lockedReason` (Geist's disabled wall) is the reason, written as the footer's line, not in a tooltip; it keeps the fields in view, inert with muted text, under a not-allowed cursor, the title and line unchanged; `unlock` is the way to get access, left out when nothing the person does unlocks it. A locked section has no `save` and no header `actions`.
+ * @behaviour "Groups related form controls inside a bordered card with optional footer actions." (https://vercel.com/geist/fieldset) Ours: one setting per card, a single SettingsField with the description its only help, unless the card's description covers several settings: then they are its SettingsRows, switches and selects together. A typed value (a name, a URL, a server, a port, a key) gets its own card. A semantic subgroup of related controls inside a field, such as radios or checkboxes, is a `FieldSet` with a `FieldLegend`. Several settings in one card are declared by SettingsRows, never by classes at the call site. "Use Toggle for a single boolean setting where ON takes effect immediately, like `Password Protection` or `Auto-Cancel Builds`." (https://vercel.com/geist/toggle) "Pair with a form footer only when the setting needs an explicit `Save` step." (https://vercel.com/geist/toggle) "Disable Toggle only when the action is impossible (missing plan, locked policy); pair with helper text or a `Tooltip` that names the resolver." (https://vercel.com/geist/toggle) Ours: a switch never applies on change; it is a row of the card, a draft until the footer's Save, as Vercel's settings cards are. A switch blocked from above is shown off and disabled, the footer saying why and never a tooltip. Required: the title and the description. The header's actions stand at the title's right; on a card narrower than 28 rem they keep the title's row and the description runs under both, as Vercel's cards read on a phone, and when the title's longest word would not fit beside them they move under the title, so they never cover it. The footer's left line (`footerHint`, `save.hint`) is optional and specific to the card, never a generic line repeated on every card: a limit, what a value is for, a plan it needs, a link; absent, it is nothing, and a card with neither a line nor a button has no footer. Ours: `save`: a typed value, one card with its own Save in the footer, always visible. The section owns the changed state: Save stays disabled until a field differs from what is saved and says `pendingLabel` while saving with Cancel beside it; a completed save calls `saved`, and the product raises one toast from its catalogue ("Completion toasts follow `{Noun} {past-participle}`: `Blob deleted`, `Domain added`, `Environment variable saved`. Never include `successfully`; the action name implies it." https://vercel.com/geist/toast), and Save returns to disabled, with no saved state in the footer. Ours: the section never raises a toast itself. A failed save keeps every value and shows under its field, or above the footer when no field owns it. `tone` marks a state with a command (a failed payment, a trial ending): a 1px border and a footer tinted in the hue with its line in it, the line saying the condition in words; title, line, fields and buttons stay neutral, an outline secondary then a default primary. A button takes the hue of its command, not of the card: `destructive` (red) for a permanent loss (Delete), `warning` (amber) for a disruptive command that can be undone (Pause, Archive). A delete card is `tone="error"` with the object's summary as its body; an archive card is neutral with a `warning` button in the footer. "Use a Note for inline contextual feedback next to the field, card, or section it describes: a region change warning above a region picker, a rate-limit notice next to a usage gauge." (https://vercel.com/geist/note) "One Note per concept." (https://vercel.com/geist/note) Ours: a message about the fields inside is a MessageNotice in the body, the card staying neutral. "Disabled checkboxes still need a Tooltip naming the reason; a greyed box with no explanation reads as a bug." (https://vercel.com/geist/checkbox) Ours: `lockedReason` (Geist's disabled wall) is the reason, written as the footer's line, not in a tooltip; it keeps the fields in view, inert with muted text, under a not-allowed cursor, the title and line unchanged; `unlock` is the way to get access, left out when nothing the person does unlocks it. A locked section has no `save` and no header `actions`.
  * @words "Helper text is sentence case, one sentence with a trailing period, on a sibling element wired through `aria-describedby`." (https://vercel.com/geist/input) Ours: the description is that helper text for the whole card, and no field has its own. "Render an optional one-sentence description as a sibling under the label that explains ON only. Don’t describe OFF; it’s the negation." (https://vercel.com/geist/toggle) Ours: a header-switch card's description says what turning it on does. The title names the values ("Personal details"); the description says what changing them does, in one line; the footer line is a Learn more link, a limit ("Use 32 characters at most."), what stays unaffected, or what is blocked and why ("Ask an owner to change this."); Save and Saving come from the product's catalogue, and so does the toast a `saved` callback raises; a delete card's description opens "Permanently delete".
  * @access "Provide an accessible name through `children`, `aria-label`, or `aria-labelledby`." (https://vercel.com/geist/toggle) Ours: the title is the section's h2 and names the form that saves it, and the header switch. The footer's line is one status, announced politely; a failure under a field marks the control invalid and describes it. Locked fields are inert, so the section's title, description and reason are what a screen reader meets.
  */
@@ -120,7 +120,7 @@ type SettingsFieldProps = SettingsFieldBase & ({
  *
  * @family Inputs
  * @when The one value of a SettingsSection: a name, an address, a choice, a switch.
- * @instead A field of a drawer's or a dialog's form is a Field from the form's own owner; a read-only fact is a SettingsFactsSection; several switches or selects in one card are SettingsRows; a switch that is the whole card and applies at once is the section's `headerSwitch`.
+ * @instead A field of a drawer's or a dialog's form is a Field from the form's own owner; a read-only fact is a SettingsFactsSection; several switches and selects in one card are SettingsRows; a switch that is the whole card and applies at once is the section's `headerSwitch`.
  * @behaviour "Helper text is sentence case, one sentence with a trailing period, on a sibling element wired through `aria-describedby`." (https://vercel.com/geist/input) Ours: label required, no help line: the card's description helps, and the (i) `info` is for a part of a value that needs a sentence. The control is 20rem wide under its label (`controlWidth`: `full` for a textarea, `natural` for a segmented control). `control="choice"` puts a checkbox or radio before its sentence; `control="switch"` puts the word for the switch's state after it and requires `stateLabel`. "Validate on blur, not on every keystroke; surface the message by passing a string to `error`." (https://vercel.com/geist/input) Ours: a validation `error` updates as the value is corrected, and it or a failed save about this field shows under the control and marks it invalid; colour sits on the control's edge and the message, never the label.
  * @words "Labels are short Title Case nouns: `Project Name`, `Domain`, `Environment Variable Name`." (https://vercel.com/geist/input) Ours: sentence case, a noun for the value ("Display name"). "Validation names the field and the constraint, ends in a period, and skips `please` (`Project name is required.`, `Code must be 6 digits.`)." (https://vercel.com/geist/input) Ours: an error says what to do next; `info.text` is one sentence and `info.label` names its button ("About display name"); a switch shows its state word ("Enabled", "Disabled") beside it.
  * @access "Don’t wrap a labelled `<Input>` in a `Tooltip`; put the explainer on a sibling icon button so the label stays announced." (https://vercel.com/geist/input) Ours: that sibling button is the (i) `info`. The control receives its id, `aria-invalid` and `aria-describedby` through `controlProps`, so the label, the info and the error are read with it. The info button has its own name and opens on focus.
@@ -138,6 +138,8 @@ type SettingsRowBase = {
 type SettingsSwitchRow = SettingsRowBase & {
     checked: boolean;
     onCheckedChange: (checked: boolean) => void;
+    options?: never;
+    control?: never;
 };
 type SettingsSelectRow = SettingsRowBase & {
     value: string;
@@ -146,30 +148,39 @@ type SettingsSelectRow = SettingsRowBase & {
         value: string;
         label: string;
     }[];
+    checked?: never;
+    control?: never;
+};
+type SettingsControlRow = SettingsRowBase & {
+    /** A control whose usage page puts it in a settings row, such as ThemeModeSwitcher. */
+    control: (props: {
+        controlProps: SettingsFieldControlProps;
+    }) => React.ReactNode;
+    options?: never;
+    checked?: never;
+};
+type StateLabels = {
+    on: string;
+    off: string;
 };
 type SettingsRowsProps = {
-    kind: "switch";
     /** The word beside each switch for its state: "Enabled" and "Disabled". */
-    stateLabels: {
-        on: string;
-        off: string;
-    };
-    rows: readonly SettingsSwitchRow[];
+    stateLabels: StateLabels;
+    rows: readonly (SettingsSwitchRow | SettingsSelectRow | SettingsControlRow)[];
 } | {
-    kind: "select";
     stateLabels?: never;
-    rows: readonly SettingsSelectRow[];
+    rows: readonly (SettingsSelectRow | SettingsControlRow)[];
 };
 /**
- * Several switches, or several selects, in one card: each row its label on the left and its control on the right.
+ * Several switches and selects in one card: each row its label on the left and its control on the right.
  *
  * @family Inputs
- * @when A card of settings of one kind, all switches or all selects, that the card's one description covers: a project's Git switches, a team's notification channels, a set of defaults.
- * @instead One setting is a SettingsField. Fields of different kinds, text boxes among them, are one card each.
- * @behaviour Declares `kind` once; every row is that kind, so a card cannot mix a switch with a select. Required on every row: the label and its `info` (an (i) with its sentence in a tooltip and on the control); no help line sits under a row. A switch row shows its state word beside the switch (`stateLabels`) and is controlled, so the word always follows the switch. Rows stand 16 px apart; below 28rem a row stacks its control under its label. "Pair with a form footer only when the setting needs an explicit `Save` step." (https://vercel.com/geist/toggle) Ours: a switch is a draft the card's Save applies.
+ * @when A card of switches and selects that the card's one description covers: a project's Git switches, a team's notification channels, a set of defaults, how long a computer stays awake beside whether the window goes to the tray.
+ * @instead One setting is a SettingsField. A text box is a field of its own card.
+ * @behaviour A row with `options` is a select, a row with `checked` a switch, and a row with `control` draws a control whose usage page puts it in a row, such as ThemeModeSwitcher; a card may hold any of them together, as Vercel's Root Directory card holds its switches; `stateLabels` is required once any row is a switch. Required on every row: the label and its `info` (an (i) with its sentence in a tooltip and on the control); no help line sits under a row. A switch row shows its state word beside the switch (`stateLabels`) and is controlled, so the word always follows the switch. Rows stand 16 px apart; below 28rem a row stacks its control under its label. "Pair with a form footer only when the setting needs an explicit `Save` step." (https://vercel.com/geist/toggle) Ours: a switch is a draft the card's Save applies.
  * @words "Title Case noun phrase, 1–4 words, naming what is true when ON: `Password Protection`, not `Enable Password Protection`." (https://vercel.com/geist/toggle) Ours: sentence case, a noun for what it controls ("Pull request comments"), the same for a switch as for a select. "Render an optional one-sentence description as a sibling under the label that explains ON only. Don’t describe OFF; it’s the negation." (https://vercel.com/geist/toggle) Ours: that sentence is `info.text`. "Options are Title Case when short and match canonical branding (`Next.js`, not `NextJS`); keep the same register across the list." (https://vercel.com/geist/select) Ours: a select's options are sentence case.
  * @access Each row's control is named by the row's label and described by its info and its error. The info button has its own name and opens on focus.
  */
-declare function SettingsRows(props: SettingsRowsProps): React.JSX.Element;
+declare function SettingsRows({ rows, stateLabels }: SettingsRowsProps): React.JSX.Element;
 export { SettingsField, SettingsRows, SettingsSection };
 //# sourceMappingURL=settings-section.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"settings-section.d.ts","sourceRoot":"","sources":["../../src/components/settings-section.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,OAAO,EACL,KAAK,YAAY,EAGlB,MAAM,0BAA0B,CAAC;AAGlC,OAAO,EAAE,KAAK,EAAoD,MAAM,oBAAoB,CAAC;AAK7F,YAAY,EAAE,YAAY,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAC;AAElF,MAAM,MAAM,yBAAyB,GAAG;IACtC,EAAE,EAAE,MAAM,CAAC;IACX,iBAAiB,EAAE,MAAM,CAAC;IAC1B,cAAc,CAAC,EAAE,IAAI,CAAC;IACtB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG,OAAO,GAAG,SAAS,CAAC;AAEtD,KAAK,YAAY,GAAG;IAClB,mDAAmD;IACnD,KAAK,EAAE,MAAM,CAAC;IACd,kEAAkE;IAClE,IAAI,EAAE,MAAM,CAAC;CACd,CAAC;AAEF,KAAK,mBAAmB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,EAAE,OAAO,GAAG,UAAU,CAAC,GAAG;IACvF,mGAAmG;IACnG,WAAW,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,KAAK,MAAM,GAAG;IACZ,uCAAuC;IACvC,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B,CAAC;AAEF,KAAK,aAAa,GAAG,MAAM,GAAG;IAC5B,IAAI,EAAE,YAAY,CAAC;IACnB,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,iEAAiE;IACjE,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,KAAK,aAAa,GAAG,MAAM,GAAG;IAC5B,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,yCAAyC;IACzC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,mIAAmI;IACnI,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,oHAAoH;IACpH,IAAI,CAAC,EAAE,mBAAmB,CAAC;IAC3B,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,uDAAuD;IACvD,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,KAAK,aAAa,GAAG,MAAM,GAAG;IAC5B,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,UAAU,CAAC,EAAE,KAAK,CAAC;IACnB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,2FAA2F;IAC3F,YAAY,EAAE,MAAM,GAAG,KAAK,CAAC,YAAY,CAAC;IAC1C,wHAAwH;IACxH,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB,CAAC;AAEF,KAAK,eAAe,GAAG;IACrB,gFAAgF;IAChF,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,mIAAmI;IACnI,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC7B,IAAI,CAAC,EAAE,KAAK,CAAC;IACb,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,MAAM,CAAC,EAAE,KAAK,CAAC;IACf,OAAO,CAAC,EAAE,KAAK,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,oBAAoB,GAAG,mBAAmB,GACpD,CAAC,aAAa,GAAG,aAAa,GAAG,aAAa,GAAG,eAAe,CAAC,CAAC;AAEpE,MAAM,MAAM,0BAA0B,GAAG,mBAAmB,GAAG,aAAa,CAAC;AAiB7E;;;;;;;;;GASG;AACH,iBAAS,eAAe,CAAC,EACvB,KAAK,EACL,WAAW,EACX,OAAO,EACP,IAAI,EACJ,QAAQ,EACR,SAAS,EACT,IAAI,EACJ,MAAM,EACN,UAAU,EACV,YAAY,EACZ,MAAM,EACN,GAAG,KAAK,EACT,EAAE,oBAAoB,qBA6DtB;AAmFD,KAAK,iBAAiB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,OAAO,KAAK,CAAC,EAAE,UAAU,GAAG,aAAa,CAAC,GAAG;IAC9F,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,WAAW,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC;IACpC,IAAI,CAAC,EAAE,YAAY,CAAC;IACpB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,EAAE,CAAC,KAAK,EAAE;QAAE,YAAY,EAAE,yBAAyB,CAAA;KAAE,KAAK,KAAK,CAAC,SAAS,CAAC;CACnF,CAAC;AAEF,KAAK,kBAAkB,GAAG,iBAAiB,GACzC,CACI;IACE,0EAA0E;IAC1E,OAAO,CAAC,EAAE,KAAK,CAAC;IAChB,YAAY,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,MAAM,CAAC;IAC/C,UAAU,CAAC,EAAE,KAAK,CAAC;CACpB,GACD;IACE,yDAAyD;IACzD,OAAO,EAAE,QAAQ,CAAC;IAClB,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,UAAU,CAAC,EAAE,KAAK,CAAC;CACpB,GACD;IACE,uFAAuF;IACvF,OAAO,EAAE,QAAQ,CAAC;IAClB,YAAY,CAAC,EAAE,KAAK,CAAC;IACrB,+DAA+D;IAC/D,UAAU,EAAE,MAAM,CAAC;CACpB,CACJ,CAAC;AAEJ;;;;;;;;;GASG;AACH,iBAAS,aAAa,CAAC,EACrB,EAAE,EACF,KAAK,EACL,IAAI,EACJ,KAAK,EACL,OAAwB,EACxB,QAAQ,EACR,QAAQ,EACR,OAAe,EACf,YAAyB,EACzB,UAAU,EACV,QAAQ,EACR,SAAS,EACT,GAAG,KAAK,EACT,EAAE,kBAAkB,qBAiCpB;AAED,KAAK,eAAe,GAAG;IACrB,EAAE,EAAE,MAAM,CAAC;IACX,KAAK,EAAE,MAAM,CAAC;IACd,kGAAkG;IAClG,IAAI,EAAE,YAAY,CAAC;IACnB,KAAK,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACxB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,KAAK,iBAAiB,GAAG,eAAe,GAAG;IACzC,OAAO,EAAE,OAAO,CAAC;IACjB,eAAe,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;CAC7C,CAAC;AAEF,KAAK,iBAAiB,GAAG,eAAe,GAAG;IACzC,KAAK,EAAE,MAAM,CAAC;IACd,aAAa,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACvC,OAAO,EAAE,SAAS;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAE,EAAE,CAAC;CACtD,CAAC;AAEF,KAAK,iBAAiB,GAClB;IACE,IAAI,EAAE,QAAQ,CAAC;IACf,2EAA2E;IAC3E,WAAW,EAAE;QAAE,EAAE,EAAE,MAAM,CAAC;QAAC,GAAG,EAAE,MAAM,CAAA;KAAE,CAAC;IACzC,IAAI,EAAE,SAAS,iBAAiB,EAAE,CAAC;CACpC,GACD;IACE,IAAI,EAAE,QAAQ,CAAC;IACf,WAAW,CAAC,EAAE,KAAK,CAAC;IACpB,IAAI,EAAE,SAAS,iBAAiB,EAAE,CAAC;CACpC,CAAC;AAsCN;;;;;;;;;GASG;AACH,iBAAS,YAAY,CAAC,KAAK,EAAE,iBAAiB,qBAU7C;AA0CD,OAAO,EAAE,aAAa,EAAE,YAAY,EAAE,eAAe,EAAE,CAAC"}
+{"version":3,"file":"settings-section.d.ts","sourceRoot":"","sources":["../../src/components/settings-section.tsx"],"names":[],"mappings":"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"}

package/dist/components/settings-section.js

@@ -26,7 +26,7 @@ const ACTIONS_ON_TITLE_ROW_WHEN_NARROW = "@max-md/settings-section:flex @max-md/
  * @family Compositions
  * @when One setting a person changes on a SettingsPage or as a section of an ObjectPage: Personal details, Company identity, Notifications. A typed value takes `save`; a switch or a short reversible choice applies at once through its own control's change, with no Save. Also a plan-gated feature, a delete card, one read-only value (an ID in a read-only mono InputGroup with its copy button, no Save), and a paid quantity (its stepper field, the price as the description, a two-fact summary under it).
  * @instead Read-only facts of an object are a SettingsFactsSection; a table or a list of records is a TableCard; Theme and Language live in the account menu; a record's edit in a list is a RowEditForm.
- * @behaviour "Groups related form controls inside a bordered card with optional footer actions." (https://vercel.com/geist/fieldset) Ours: one setting per card: a single SettingsField, the description its only help. A typed value (a name, a URL, a server, a port, a key) gets its own card. A semantic subgroup of related controls inside a field, such as radios or checkboxes, is a `FieldSet` with a `FieldLegend`. One more shape exists, declared by a part and never by classes at the call site. A card of several settings holds SettingsRows, label left and control right, only when every row is a switch or every row is a select. "Use Toggle for a single boolean setting where ON takes effect immediately, like `Password Protection` or `Auto-Cancel Builds`." (https://vercel.com/geist/toggle) "Pair with a form footer only when the setting needs an explicit `Save` step." (https://vercel.com/geist/toggle) "Disable Toggle only when the action is impossible (missing plan, locked policy); pair with helper text or a `Tooltip` that names the resolver." (https://vercel.com/geist/toggle) Ours: a switch never applies on change; it is a row of the card, a draft until the footer's Save, as Vercel's settings cards are. A switch blocked from above is shown off and disabled, the footer saying why and never a tooltip. Required: the title and the description. The header's actions stand at the title's right; on a card narrower than 28 rem they keep the title's row and the description runs under both, as Vercel's cards read on a phone, and when the title's longest word would not fit beside them they move under the title, so they never cover it. The footer's left line (`footerHint`, `save.hint`) is optional and specific to the card, never a generic line repeated on every card: a limit, what a value is for, a plan it needs, a link; absent, it is nothing, and a card with neither a line nor a button has no footer. Ours: `save`: a typed value, one card with its own Save in the footer, always visible. The section owns the changed state: Save stays disabled until a field differs from what is saved and says `pendingLabel` while saving with Cancel beside it; a completed save calls `saved`, and the product raises one toast from its catalogue ("Completion toasts follow `{Noun} {past-participle}`: `Blob deleted`, `Domain added`, `Environment variable saved`. Never include `successfully`; the action name implies it." https://vercel.com/geist/toast), and Save returns to disabled, with no saved state in the footer. Ours: the section never raises a toast itself. A failed save keeps every value and shows under its field, or above the footer when no field owns it. `tone` marks a state with a command (a failed payment, a trial ending): a 1px border and a footer tinted in the hue with its line in it, the line saying the condition in words; title, line, fields and buttons stay neutral, an outline secondary then a default primary. A button takes the hue of its command, not of the card: `destructive` (red) for a permanent loss (Delete), `warning` (amber) for a disruptive command that can be undone (Pause, Archive). A delete card is `tone="error"` with the object's summary as its body; an archive card is neutral with a `warning` button in the footer. "Use a Note for inline contextual feedback next to the field, card, or section it describes: a region change warning above a region picker, a rate-limit notice next to a usage gauge." (https://vercel.com/geist/note) "One Note per concept." (https://vercel.com/geist/note) Ours: a message about the fields inside is a MessageNotice in the body, the card staying neutral. "Disabled checkboxes still need a Tooltip naming the reason; a greyed box with no explanation reads as a bug." (https://vercel.com/geist/checkbox) Ours: `lockedReason` (Geist's disabled wall) is the reason, written as the footer's line, not in a tooltip; it keeps the fields in view, inert with muted text, under a not-allowed cursor, the title and line unchanged; `unlock` is the way to get access, left out when nothing the person does unlocks it. A locked section has no `save` and no header `actions`.
+ * @behaviour "Groups related form controls inside a bordered card with optional footer actions." (https://vercel.com/geist/fieldset) Ours: one setting per card, a single SettingsField with the description its only help, unless the card's description covers several settings: then they are its SettingsRows, switches and selects together. A typed value (a name, a URL, a server, a port, a key) gets its own card. A semantic subgroup of related controls inside a field, such as radios or checkboxes, is a `FieldSet` with a `FieldLegend`. Several settings in one card are declared by SettingsRows, never by classes at the call site. "Use Toggle for a single boolean setting where ON takes effect immediately, like `Password Protection` or `Auto-Cancel Builds`." (https://vercel.com/geist/toggle) "Pair with a form footer only when the setting needs an explicit `Save` step." (https://vercel.com/geist/toggle) "Disable Toggle only when the action is impossible (missing plan, locked policy); pair with helper text or a `Tooltip` that names the resolver." (https://vercel.com/geist/toggle) Ours: a switch never applies on change; it is a row of the card, a draft until the footer's Save, as Vercel's settings cards are. A switch blocked from above is shown off and disabled, the footer saying why and never a tooltip. Required: the title and the description. The header's actions stand at the title's right; on a card narrower than 28 rem they keep the title's row and the description runs under both, as Vercel's cards read on a phone, and when the title's longest word would not fit beside them they move under the title, so they never cover it. The footer's left line (`footerHint`, `save.hint`) is optional and specific to the card, never a generic line repeated on every card: a limit, what a value is for, a plan it needs, a link; absent, it is nothing, and a card with neither a line nor a button has no footer. Ours: `save`: a typed value, one card with its own Save in the footer, always visible. The section owns the changed state: Save stays disabled until a field differs from what is saved and says `pendingLabel` while saving with Cancel beside it; a completed save calls `saved`, and the product raises one toast from its catalogue ("Completion toasts follow `{Noun} {past-participle}`: `Blob deleted`, `Domain added`, `Environment variable saved`. Never include `successfully`; the action name implies it." https://vercel.com/geist/toast), and Save returns to disabled, with no saved state in the footer. Ours: the section never raises a toast itself. A failed save keeps every value and shows under its field, or above the footer when no field owns it. `tone` marks a state with a command (a failed payment, a trial ending): a 1px border and a footer tinted in the hue with its line in it, the line saying the condition in words; title, line, fields and buttons stay neutral, an outline secondary then a default primary. A button takes the hue of its command, not of the card: `destructive` (red) for a permanent loss (Delete), `warning` (amber) for a disruptive command that can be undone (Pause, Archive). A delete card is `tone="error"` with the object's summary as its body; an archive card is neutral with a `warning` button in the footer. "Use a Note for inline contextual feedback next to the field, card, or section it describes: a region change warning above a region picker, a rate-limit notice next to a usage gauge." (https://vercel.com/geist/note) "One Note per concept." (https://vercel.com/geist/note) Ours: a message about the fields inside is a MessageNotice in the body, the card staying neutral. "Disabled checkboxes still need a Tooltip naming the reason; a greyed box with no explanation reads as a bug." (https://vercel.com/geist/checkbox) Ours: `lockedReason` (Geist's disabled wall) is the reason, written as the footer's line, not in a tooltip; it keeps the fields in view, inert with muted text, under a not-allowed cursor, the title and line unchanged; `unlock` is the way to get access, left out when nothing the person does unlocks it. A locked section has no `save` and no header `actions`.
  * @words "Helper text is sentence case, one sentence with a trailing period, on a sibling element wired through `aria-describedby`." (https://vercel.com/geist/input) Ours: the description is that helper text for the whole card, and no field has its own. "Render an optional one-sentence description as a sibling under the label that explains ON only. Don’t describe OFF; it’s the negation." (https://vercel.com/geist/toggle) Ours: a header-switch card's description says what turning it on does. The title names the values ("Personal details"); the description says what changing them does, in one line; the footer line is a Learn more link, a limit ("Use 32 characters at most."), what stays unaffected, or what is blocked and why ("Ask an owner to change this."); Save and Saving come from the product's catalogue, and so does the toast a `saved` callback raises; a delete card's description opens "Permanently delete".
  * @access "Provide an accessible name through `children`, `aria-label`, or `aria-labelledby`." (https://vercel.com/geist/toggle) Ours: the title is the section's h2 and names the form that saves it, and the header switch. The footer's line is one status, announced politely; a failure under a field marks the control invalid and describes it. Locked fields are inert, so the section's title, description and reason are what a screen reader meets.
  */
@@ -48,8 +48,8 @@ function controlPropsOf({ id, info, error, invalid, disabled, required, }) {
             .join(" ") || undefined,
     };
 }
-function SettingsFieldLabel({ id, label, info, }) {
-    const fieldLabel = (_jsx(FieldLabel, { htmlFor: id, id: `${id}-label`, children: label }));
+function SettingsFieldLabel({ id, label, info, beside = false, }) {
+    const fieldLabel = (_jsx(FieldLabel, { htmlFor: id, id: `${id}-label`, className: beside ? "text-xs font-medium text-foreground" : undefined, children: label }));
     if (!info)
         return fieldLabel;
     return (_jsxs("div", { className: "flex items-center gap-1", children: [fieldLabel, _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { render: _jsx(Button, { "aria-label": info.label, size: "icon-xs", variant: "ghost" }), children: _jsx(Info, { "aria-hidden": "true" }) }), _jsx(TooltipContent, { children: info.text })] }), _jsx("span", { hidden: true, id: `${id}-info`, children: info.text })] }));
@@ -74,7 +74,7 @@ function controlCellClassName(control, controlWidth) {
  *
  * @family Inputs
  * @when The one value of a SettingsSection: a name, an address, a choice, a switch.
- * @instead A field of a drawer's or a dialog's form is a Field from the form's own owner; a read-only fact is a SettingsFactsSection; several switches or selects in one card are SettingsRows; a switch that is the whole card and applies at once is the section's `headerSwitch`.
+ * @instead A field of a drawer's or a dialog's form is a Field from the form's own owner; a read-only fact is a SettingsFactsSection; several switches and selects in one card are SettingsRows; a switch that is the whole card and applies at once is the section's `headerSwitch`.
  * @behaviour "Helper text is sentence case, one sentence with a trailing period, on a sibling element wired through `aria-describedby`." (https://vercel.com/geist/input) Ours: label required, no help line: the card's description helps, and the (i) `info` is for a part of a value that needs a sentence. The control is 20rem wide under its label (`controlWidth`: `full` for a textarea, `natural` for a segmented control). `control="choice"` puts a checkbox or radio before its sentence; `control="switch"` puts the word for the switch's state after it and requires `stateLabel`. "Validate on blur, not on every keystroke; surface the message by passing a string to `error`." (https://vercel.com/geist/input) Ours: a validation `error` updates as the value is corrected, and it or a failed save about this field shows under the control and marks it invalid; colour sits on the control's edge and the message, never the label.
  * @words "Labels are short Title Case nouns: `Project Name`, `Domain`, `Environment Variable Name`." (https://vercel.com/geist/input) Ours: sentence case, a noun for the value ("Display name"). "Validation names the field and the constraint, ends in a period, and skips `please` (`Project name is required.`, `Code must be 6 digits.`)." (https://vercel.com/geist/input) Ours: an error says what to do next; `info.text` is one sentence and `info.label` names its button ("About display name"); a switch shows its state word ("Enabled", "Disabled") beside it.
  * @access "Don’t wrap a labelled `<Input>` in a `Tooltip`; put the explainer on a sibling icon button so the label stays announced." (https://vercel.com/geist/input) Ours: that sibling button is the (i) `info`. The control receives its id, `aria-invalid` and `aria-describedby` through `controlProps`, so the label, the info and the error are read with it. The info button has its own name and opens on focus.
@@ -86,28 +86,35 @@ function SettingsField({ id, label, info, error, invalid = Boolean(error), disab
     const controlCell = (_jsxs("div", { "data-slot": "settings-field-control", className: cn("flex min-w-0", controlCellClassName(control, controlWidth)), children: [children({ controlProps }), control === "switch" ? _jsx("span", { className: "text-sm", children: stateLabel }) : null] }));
     return (_jsx("div", { "data-slot": "settings-field", "data-invalid": invalid ? true : undefined, className: "contents", children: _jsxs(Field, { "data-invalid": invalid ? true : undefined, "data-disabled": disabled ? true : undefined, orientation: beside ? "horizontal" : "vertical", className: cn("items-start", className), ...props, children: [beside ? controlCell : null, _jsxs(FieldContent, { children: [_jsx(SettingsFieldLabel, { id: id, label: label, info: info }), beside ? errors : null] }), beside ? null : controlCell, beside ? null : errors] }) }));
 }
-function SettingsRow({ id, label, info, error, disabled, children, }) {
+function SettingsRow({ id, label, info, error, disabled, kind, children, }) {
     const invalid = Boolean(error);
     const controlProps = controlPropsOf({ id, info, error, invalid, disabled });
-    return (_jsx("div", { "data-slot": "settings-row", "data-invalid": invalid ? true : undefined, className: "contents", children: _jsxs(Field, { "data-invalid": invalid ? true : undefined, "data-disabled": disabled ? true : undefined, orientation: "horizontal", className: "flex-wrap has-[>[data-slot=field-content]]:items-center", children: [_jsxs(FieldContent, { className: "flex-auto", children: [_jsx(SettingsFieldLabel, { id: id, label: label, info: info }), _jsx(SettingsFieldErrors, { id: id, error: error })] }), _jsx("div", { "data-slot": "settings-row-control", className: "flex items-center gap-2 group-data-[kind=select]/settings-rows:w-48 group-data-[kind=select]/settings-rows:max-w-full", children: children({ controlProps }) })] }) }));
+    return (_jsx("div", { "data-slot": "settings-row", "data-invalid": invalid ? true : undefined, className: "contents", children: _jsxs(Field, { "data-invalid": invalid ? true : undefined, "data-disabled": disabled ? true : undefined, orientation: "horizontal", className: "flex-wrap has-[>[data-slot=field-content]]:items-center", children: [_jsxs(FieldContent, { className: "flex-auto", children: [_jsx(SettingsFieldLabel, { id: id, label: label, info: info, beside: true }), _jsx(SettingsFieldErrors, { id: id, error: error })] }), _jsx("div", { "data-slot": "settings-row-control", "data-kind": kind, className: "flex items-center gap-2 data-[kind=control]:w-64 data-[kind=control]:max-w-full data-[kind=select]:w-48 data-[kind=select]:max-w-full", children: children({ controlProps }) })] }) }));
 }
 /**
- * Several switches, or several selects, in one card: each row its label on the left and its control on the right.
+ * Several switches and selects in one card: each row its label on the left and its control on the right.
  *
  * @family Inputs
- * @when A card of settings of one kind, all switches or all selects, that the card's one description covers: a project's Git switches, a team's notification channels, a set of defaults.
- * @instead One setting is a SettingsField. Fields of different kinds, text boxes among them, are one card each.
- * @behaviour Declares `kind` once; every row is that kind, so a card cannot mix a switch with a select. Required on every row: the label and its `info` (an (i) with its sentence in a tooltip and on the control); no help line sits under a row. A switch row shows its state word beside the switch (`stateLabels`) and is controlled, so the word always follows the switch. Rows stand 16 px apart; below 28rem a row stacks its control under its label. "Pair with a form footer only when the setting needs an explicit `Save` step." (https://vercel.com/geist/toggle) Ours: a switch is a draft the card's Save applies.
+ * @when A card of switches and selects that the card's one description covers: a project's Git switches, a team's notification channels, a set of defaults, how long a computer stays awake beside whether the window goes to the tray.
+ * @instead One setting is a SettingsField. A text box is a field of its own card.
+ * @behaviour A row with `options` is a select, a row with `checked` a switch, and a row with `control` draws a control whose usage page puts it in a row, such as ThemeModeSwitcher; a card may hold any of them together, as Vercel's Root Directory card holds its switches; `stateLabels` is required once any row is a switch. Required on every row: the label and its `info` (an (i) with its sentence in a tooltip and on the control); no help line sits under a row. A switch row shows its state word beside the switch (`stateLabels`) and is controlled, so the word always follows the switch. Rows stand 16 px apart; below 28rem a row stacks its control under its label. "Pair with a form footer only when the setting needs an explicit `Save` step." (https://vercel.com/geist/toggle) Ours: a switch is a draft the card's Save applies.
  * @words "Title Case noun phrase, 1–4 words, naming what is true when ON: `Password Protection`, not `Enable Password Protection`." (https://vercel.com/geist/toggle) Ours: sentence case, a noun for what it controls ("Pull request comments"), the same for a switch as for a select. "Render an optional one-sentence description as a sibling under the label that explains ON only. Don’t describe OFF; it’s the negation." (https://vercel.com/geist/toggle) Ours: that sentence is `info.text`. "Options are Title Case when short and match canonical branding (`Next.js`, not `NextJS`); keep the same register across the list." (https://vercel.com/geist/select) Ours: a select's options are sentence case.
  * @access Each row's control is named by the row's label and described by its info and its error. The info button has its own name and opens on focus.
  */
-function SettingsRows(props) {
-    return (_jsx("div", { "data-slot": "settings-rows", "data-kind": props.kind, className: "group/settings-rows flex flex-col gap-4", children: props.kind === "switch" ? switchRows(props.rows, props.stateLabels) : selectRows(props.rows) }));
+function SettingsRows({ rows, stateLabels }) {
+    return (_jsx("div", { "data-slot": "settings-rows", className: "flex flex-col gap-4", children: rows.map((row) => {
+            if (row.control !== undefined)
+                return controlRow(row);
+            return row.options === undefined ? switchRow(row, stateLabels) : selectRow(row);
+        }) }));
 }
-function switchRows(rows, stateLabels) {
-    return rows.map((row) => (_jsx(SettingsRow, { ...row, children: ({ controlProps }) => (_jsxs(_Fragment, { children: [_jsx(Switch, { ...controlProps, checked: row.checked, name: row.name, onCheckedChange: row.onCheckedChange, size: "md" }), _jsx("span", { className: "text-sm", children: row.checked ? stateLabels.on : stateLabels.off })] })) }, row.id)));
+function switchRow(row, stateLabels) {
+    return (_jsx(SettingsRow, { kind: "switch", ...row, children: ({ controlProps }) => (_jsxs(_Fragment, { children: [_jsx(Switch, { ...controlProps, checked: row.checked, name: row.name, onCheckedChange: row.onCheckedChange, size: "md" }), _jsx("span", { className: "text-sm", children: row.checked ? stateLabels?.on : stateLabels?.off })] })) }, row.id));
 }
-function selectRows(rows) {
-    return rows.map((row) => (_jsx(SettingsRow, { ...row, children: ({ controlProps }) => (_jsx(NativeSelect, { ...controlProps, name: row.name, onChange: (event) => row.onValueChange(event.target.value), value: row.value, children: row.options.map((option) => (_jsx(NativeSelectOption, { value: option.value, children: option.label }, option.value))) })) }, row.id)));
+function controlRow(row) {
+    return (_jsx(SettingsRow, { kind: "control", ...row, children: row.control }, row.id));
+}
+function selectRow(row) {
+    return (_jsx(SettingsRow, { kind: "select", ...row, children: ({ controlProps }) => (_jsx(NativeSelect, { ...controlProps, name: row.name, onChange: (event) => row.onValueChange(event.target.value), value: row.value, children: row.options.map((option) => (_jsx(NativeSelectOption, { value: option.value, children: option.label }, option.value))) })) }, row.id));
 }
 export { SettingsField, SettingsRows, SettingsSection };

package/dist/components/switch.d.ts

@@ -23,7 +23,8 @@ import { type ControlName } from "../internal/control-name.js";
  * named: `aria-label` or `aria-labelledby`, or an `id` that a `FieldLabel`'s `htmlFor` points at,
  * and a switch with none of them does not compile. A bare `Switch` is the 28 by 14 px track with an
  * 11 px thumb; `md` is 36 by 20 px and `lg` 40 by 24 px. Colour: off is the input grey, on is
- * ink, and a disabled switch turns grey, on or off, with a greyer thumb and no shadow. Space flips
+ * cobalto, the thumb white in both themes, and a disabled switch turns grey, on or off, with a
+ * greyer thumb and no shadow. Space flips
  * it. On a settings page it is a draft its card's footer Save applies, and the product's toast
  * confirms the save, in one of two places: in the card's body under its label, its state word after
  * it (`SettingsField`'s `control="switch"`); or at the end of a row of a card of several settings,

package/dist/components/switch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../src/components/switch.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAGlE,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAE3D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AACH,iBAAS,MAAM,CAAC,EACd,SAAS,EACT,IAAW,EACX,GAAG,KAAK,EACT,EAAE,eAAe,CAAC,IAAI,CAAC,KAAK,GAC3B,WAAW,GAAG;IACZ,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CAC3B,+BAiBF;AAED,OAAO,EAAE,MAAM,EAAE,CAAC"}
+{"version":3,"file":"switch.d.ts","sourceRoot":"","sources":["../../src/components/switch.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,IAAI,eAAe,EAAE,MAAM,uBAAuB,CAAC;AAGlE,OAAO,EAAE,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAE3D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6CG;AACH,iBAAS,MAAM,CAAC,EACd,SAAS,EACT,IAAW,EACX,GAAG,KAAK,EACT,EAAE,eAAe,CAAC,IAAI,CAAC,KAAK,GAC3B,WAAW,GAAG;IACZ,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CAC3B,+BAiBF;AAED,OAAO,EAAE,MAAM,EAAE,CAAC"}

package/dist/components/switch.js

@@ -24,7 +24,8 @@ import { cn } from "../lib/utils.js";
  * named: `aria-label` or `aria-labelledby`, or an `id` that a `FieldLabel`'s `htmlFor` points at,
  * and a switch with none of them does not compile. A bare `Switch` is the 28 by 14 px track with an
  * 11 px thumb; `md` is 36 by 20 px and `lg` 40 by 24 px. Colour: off is the input grey, on is
- * ink, and a disabled switch turns grey, on or off, with a greyer thumb and no shadow. Space flips
+ * cobalto, the thumb white in both themes, and a disabled switch turns grey, on or off, with a
+ * greyer thumb and no shadow. Space flips
  * it. On a settings page it is a draft its card's footer Save applies, and the product's toast
  * confirms the save, in one of two places: in the card's body under its label, its state word after
  * it (`SettingsField`'s `control="switch"`); or at the end of a row of a card of several settings,
@@ -47,6 +48,6 @@ import { cn } from "../lib/utils.js";
  * both states; a missing name does not compile.
  */
 function Switch({ className, size = "sm", ...props }) {
-    return (_jsx(SwitchPrimitive.Root, { "data-slot": "switch", "data-size": size, className: cn("nc-transition-paint peer group/switch relative inline-flex shrink-0 items-start rounded-full border border-transparent p-0 after:absolute after:top-1/2 after:left-1/2 after:size-touch-target after:-translate-x-1/2 after:-translate-y-1/2 aria-invalid:border-destructive data-[size=sm]:h-3.5 data-[size=sm]:w-7 data-[size=md]:h-5 data-[size=md]:w-9 data-[size=lg]:h-6 data-[size=lg]:w-10 data-checked:bg-primary data-unchecked:bg-input data-disabled:cursor-not-allowed data-disabled:data-checked:bg-input/50 [@media(hover:hover)_and_(pointer:fine)]:after:hidden", className), ...props, children: _jsx(SwitchPrimitive.Thumb, { "data-slot": "switch-thumb", className: "pointer-events-none mt-px block rounded-full bg-background ring-0 nc-transition-transform not-data-disabled:nc-elevation-resting group-data-[size=sm]/switch:ml-px group-data-[size=sm]/switch:size-2.75 group-data-[size=md]/switch:size-4.25 group-data-[size=lg]/switch:ml-px group-data-[size=lg]/switch:size-5.25 group-data-[size=sm]/switch:data-checked:translate-x-3.5 group-data-[size=md]/switch:data-checked:translate-x-4.25 group-data-[size=lg]/switch:data-checked:translate-x-4 data-disabled:bg-muted data-unchecked:translate-x-0" }) }));
+    return (_jsx(SwitchPrimitive.Root, { "data-slot": "switch", "data-size": size, className: cn("nc-transition-paint peer group/switch relative inline-flex shrink-0 items-start rounded-full border border-transparent p-0 after:absolute after:top-1/2 after:left-1/2 after:size-touch-target after:-translate-x-1/2 after:-translate-y-1/2 aria-invalid:border-destructive data-[size=sm]:h-3.5 data-[size=sm]:w-7 data-[size=md]:h-5 data-[size=md]:w-9 data-[size=lg]:h-6 data-[size=lg]:w-10 data-checked:bg-primary data-unchecked:bg-input data-disabled:cursor-not-allowed data-disabled:data-checked:bg-input/50 [@media(hover:hover)_and_(pointer:fine)]:after:hidden", className), ...props, children: _jsx(SwitchPrimitive.Thumb, { "data-slot": "switch-thumb", className: "pointer-events-none mt-px block rounded-full bg-primary-foreground ring-0 nc-transition-transform not-data-disabled:nc-elevation-resting group-data-[size=sm]/switch:ml-px group-data-[size=sm]/switch:size-2.75 group-data-[size=md]/switch:size-4.25 group-data-[size=lg]/switch:ml-px group-data-[size=lg]/switch:size-5.25 group-data-[size=sm]/switch:data-checked:translate-x-3.5 group-data-[size=md]/switch:data-checked:translate-x-4.25 group-data-[size=lg]/switch:data-checked:translate-x-4 data-disabled:bg-muted data-unchecked:translate-x-0" }) }));
 }
 export { Switch };

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

@@ -23,7 +23,7 @@ export type ThemeModeSwitcherProps = Omit<React.ComponentProps<typeof RadioGroup
  * The three appearances side by side, each with its glyph and its name.
  *
  * @family Choices
- * @when An Appearance setting on a settings page, where the choice has room to show its names.
+ * @when An Appearance setting on a settings page, where the choice has room to show its names: its own field, or a row of a SettingsRows card, `compact`, beside settings of the same card.
  * @instead Inside a menu, the same choice is ThemeModeMenu; a choice that is not the appearance is a RadioGroup or a ToggleGroup.
  * @behaviour Exclusive: one mode is selected; on a settings card the choice is a draft the card's Save applies. The order is System, Light, Dark everywhere.
  * @words The setting's name, then each mode's name from the product's catalogue: "System", "Light", "Dark".

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

@@ -17,7 +17,7 @@ const themeModeIcons = {
  * The three appearances side by side, each with its glyph and its name.
  *
  * @family Choices
- * @when An Appearance setting on a settings page, where the choice has room to show its names.
+ * @when An Appearance setting on a settings page, where the choice has room to show its names: its own field, or a row of a SettingsRows card, `compact`, beside settings of the same card.
  * @instead Inside a menu, the same choice is ThemeModeMenu; a choice that is not the appearance is a RadioGroup or a ToggleGroup.
  * @behaviour Exclusive: one mode is selected; on a settings card the choice is a draft the card's Save applies. The order is System, Light, Dark everywhere.
  * @words The setting's name, then each mode's name from the product's catalogue: "System", "Light", "Dark".

package/dist/showcase/specimens/compositions.js

@@ -64,7 +64,7 @@ const CATALOG = [
         entries: [
             {
                 id: "quotes",
-                mark: { kind: "record", icon: Wrench, tone: "skill" },
+                mark: { kind: "record", icon: Wrench },
                 name: "Write quotes from the price list",
                 description: "Reads listino-2026.xlsx and drafts a quote in the customer's language.",
                 add: { label: "Add skill", onClick: nothing },

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

@@ -1 +1 @@
-{"version":3,"file":"inputs.d.ts","sourceRoot":"","sources":["../../../src/showcase/specimens/inputs.tsx"],"names":[],"mappings":"AA6BA,iBAAS,gBAAgB,gCAexB;AAED,iBAAS,wBAAwB,gCAqBhC;AAED,iBAAS,sBAAsB,gCAiC9B;AAED,iBAAS,kBAAkB,gCAqC1B;AAED,iBAAS,gBAAgB,gCA2BxB;AAED,iBAAS,cAAc,gCAuCtB;AAqBD,iBAAS,oBAAoB,gCAsD5B;AAED,eAAO,MAAM,MAAM;;;;;;;;;;;;;;CAoHQ,CAAC"}
+{"version":3,"file":"inputs.d.ts","sourceRoot":"","sources":["../../../src/showcase/specimens/inputs.tsx"],"names":[],"mappings":"AA6BA,iBAAS,gBAAgB,gCAexB;AAED,iBAAS,wBAAwB,gCAqBhC;AAED,iBAAS,sBAAsB,gCAiC9B;AAED,iBAAS,kBAAkB,gCAqC1B;AAED,iBAAS,gBAAgB,gCA2BxB;AAED,iBAAS,cAAc,gCAuCtB;AAqBD,iBAAS,oBAAoB,gCAoD5B;AAED,eAAO,MAAM,MAAM;;;;;;;;;;;;;;CAoHQ,CAAC"}

package/dist/showcase/specimens/inputs.js

@@ -54,7 +54,7 @@ function SettingsRowsSpecimen() {
     const [approvals, setApprovals] = useState(true);
     const [reminders, setReminders] = useState(false);
     const [zone, setZone] = useState("Europe/Rome");
-    return (_jsxs("div", { className: "grid gap-6", children: [_jsx(SettingsSection, { description: "Choose which events ask for your attention.", title: "Notifications", children: _jsx(SettingsRows, { kind: "switch", rows: [
+    return (_jsxs("div", { className: "grid gap-6", children: [_jsx(SettingsSection, { description: "Choose which events ask for your attention.", title: "Notifications", children: _jsx(SettingsRows, { rows: [
                         {
                             id: "showcase-rows-approvals",
                             label: "Approvals",
@@ -71,7 +71,7 @@ function SettingsRowsSpecimen() {
                             onCheckedChange: setReminders,
                             name: "reminders",
                         },
-                    ], stateLabels: STATE_LABELS }) }), _jsx(SettingsSection, { description: "Dates and times follow this choice.", title: "Region", children: _jsx(SettingsRows, { kind: "select", rows: [
+                    ], stateLabels: STATE_LABELS }) }), _jsx(SettingsSection, { description: "Dates and times follow this choice.", title: "Region", children: _jsx(SettingsRows, { rows: [
                         {
                             id: "showcase-rows-zone",
                             label: "Time zone",

package/dist/showcase/specimens/status.js

@@ -71,7 +71,7 @@ export const STATUS = {
                         ] }), _jsx(CheckState, { label: "1 check failed", outcome: "failed" })] }), _jsxs("span", { className: "flex items-center gap-3", children: [_jsx("span", { className: "flex-1", children: "Messaging" }), _jsx(CheckState, { label: "All channels connected", outcome: "passed" })] })] })),
     FileTypeIcon: () => (_jsx("div", { className: "grid gap-2 text-sm", children: ["mcp.json", "deploy.sh", "README.md", "schema.sql"].map((path) => (_jsxs("span", { className: "flex items-center gap-2 font-mono", children: [_jsx(FileTypeIcon, { className: "size-4", path: path }), path] }, path))) })),
     Gauge: GaugeSpecimen,
-    IdentityMark: () => (_jsxs("div", { className: "flex flex-wrap items-center gap-4", children: [_jsx(IdentityMark, { kind: "agent", orb: { form: "orbit", color: COBALTO } }), _jsx(IdentityMark, { app: "gmail", kind: "app", logo: composioLogo("gmail") }), _jsx(IdentityMark, { kind: "company", name: "Acme Service & Parts" }), _jsx(IdentityMark, { kind: "company", logo: SAMPLE_LOGO, name: "Studio Rossi" }), _jsx(IdentityMark, { kind: "company", logo: SAMPLE_ICON, name: "Polaris Studio" }), _jsx(IdentityMark, { kind: "person", name: "Ada Rossi" }), _jsx(IdentityMark, { icon: Mail, kind: "record" }), _jsx(IdentityMark, { icon: Wrench, kind: "record", size: 40, tone: "skill" })] })),
+    IdentityMark: () => (_jsxs("div", { className: "flex flex-wrap items-center gap-4", children: [_jsx(IdentityMark, { kind: "agent", orb: { form: "orbit", color: COBALTO } }), _jsx(IdentityMark, { app: "gmail", kind: "app", logo: composioLogo("gmail") }), _jsx(IdentityMark, { kind: "company", name: "Acme Service & Parts" }), _jsx(IdentityMark, { kind: "company", logo: SAMPLE_LOGO, name: "Studio Rossi" }), _jsx(IdentityMark, { kind: "company", logo: SAMPLE_ICON, name: "Polaris Studio" }), _jsx(IdentityMark, { kind: "person", name: "Ada Rossi" }), _jsx(IdentityMark, { icon: Mail, kind: "record" }), _jsx(IdentityMark, { icon: Wrench, kind: "record", size: 40 })] })),
     ModelIdentity: () => (_jsxs("div", { className: "grid gap-2", children: [_jsx(ModelIdentity, { model: "anthropic/claude-opus-5" }), _jsx(ModelIdentity, { model: "openai/gpt-5.6-sol" }), _jsx(ModelIdentity, { model: "x-ai/grok-4.5" })] })),
     ModelMark: () => (_jsxs("div", { className: "flex flex-wrap items-center gap-4", children: [_jsx(ModelMark, { author: "anthropic", name: "Claude Opus 5" }), _jsx(ModelMark, { author: "mistralai", label: "Mistral" })] })),
     PlatformMark: () => (_jsx("div", { className: "flex flex-wrap items-center gap-4 text-sm", children: ["google", "microsoft", "apple", "telegram", "whatsapp", "slack"].map((platform) => (_jsxs("span", { className: "flex items-center gap-2 capitalize", children: [_jsx(PlatformMark, { platform: platform, size: 20 }), platform] }, platform))) })),
@@ -103,7 +103,7 @@ export const STATUS = {
                 action: { label: "Open downloads", onClick: nothing },
             },
         ], title: "Customer setup" })),
-    RecordIdentity: () => (_jsx("div", { className: "max-w-sm", children: _jsx(RecordIdentity, { detail: "Company skill \u00B7 every Agent has it", hint: "skl_0042", mark: { kind: "record", icon: Wrench, tone: "skill" }, name: "Write quotes from the price list" }) })),
+    RecordIdentity: () => (_jsx("div", { className: "max-w-sm", children: _jsx(RecordIdentity, { detail: "Company skill \u00B7 every Agent has it", hint: "skl_0042", mark: { kind: "record", icon: Wrench }, name: "Write quotes from the price list" }) })),
     StatusBadge: () => (_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx(StatusBadge, { label: "Connected", tone: "success" }), _jsx(StatusBadge, { label: "Waiting for you", since: "2h", tone: "warning" }), _jsx(StatusBadge, { label: "Failed", tone: "danger" }), _jsx(StatusBadge, { label: "Running", tone: "info" }), _jsx(StatusBadge, { label: "Paused", tone: "neutral" })] })),
     ObjectFactValue: () => (_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx(ObjectFactValue, { kind: "agents", children: "5 active" }), _jsx(ObjectFactValue, { kind: "installations", children: "2" }), _jsx(ObjectFactValue, { kind: "customers", children: "12" })] })),
     Tag: () => (_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx(Tag, { tone: "blue", children: "Rossi Ottica" }), _jsx(Tag, { tone: "teal", children: "Partner" }), _jsx(Tag, { note: "Your account", quiet: true, children: "Direct customer" })] })),

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":"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,YAAY,GACZ,gBAAgB,GAChB,aAAa,GACb,UAAU,GACV,gBAAgB,GAChB,kBAAkB,GAClB,OAAO,GACP,OAAO,GACP,YAAY,GACZ,UAAU,GACV,OAAO,GACP,cAAc,GACd,eAAe,GACf,cAAc,GACd,QAAQ,GACR,UAAU,GACV,UAAU,GACV,gBAAgB,GAChB,gBAAgB,GAChB,UAAU,GACV,aAAa,GACb,aAAa,GACb,YAAY,GACZ,iBAAiB,GACjB,kBAAkB,GAClB,QAAQ,GACR,QAAQ,GACR,mBAAmB,GACnB,mBAAmB,GACnB,QAAQ,GACR,aAAa,GACb,cAAc,GACd,UAAU,GACV,SAAS,GACT,UAAU,GACV,QAAQ,GACR,OAAO,GACP,eAAe,GACf,aAAa,GACb,cAAc,GACd,cAAc,GACd,eAAe,GACf,WAAW,GACX,iBAAiB,GACjB,cAAc,GACd,mBAAmB,GACnB,gBAAgB,GAChB,aAAa,GACb,KAAK,GACL,cAAc,GACd,YAAY,GACZ,eAAe,GACf,QAAQ,GACR,oBAAoB,GACpB,eAAe,GACf,SAAS,GACT,cAAc,GACd,aAAa,GACb,cAAc,GACd,oBAAoB,GACpB,iBAAiB,GACjB,MAAM,GACN,SAAS,GACT,kBAAkB,GAClB,WAAW,GACX,MAAM,GACN,SAAS,GACT,WAAW,GACX,WAAW,GACX,WAAW,GACX,eAAe,GACf,UAAU,GACV,OAAO,GACP,MAAM,GACN,KAAK,GACL,gBAAgB,GAChB,aAAa,GACb,aAAa,GACb,UAAU,GACV,QAAQ,GACR,YAAY,GACZ,aAAa,GACb,sBAAsB,GACtB,SAAS,GACT,OAAO,GACP,WAAW,GACX,YAAY,GACZ,oBAAoB,GACpB,YAAY,GACZ,OAAO,GACP,YAAY,GACZ,eAAe,GACf,gBAAgB,GAChB,WAAW,GACX,eAAe,GACf,cAAc,GACd,cAAc,GACd,UAAU,GACV,gBAAgB,GAChB,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,OAAO,GACP,eAAe,GACf,kBAAkB,GAClB,kBAAkB,GAClB,oBAAoB,GACpB,kBAAkB,GAClB,iBAAiB,GACjB,WAAW,GACX,gBAAgB,GAChB,cAAc,GACd,gBAAgB,GAChB,kBAAkB,GAClB,SAAS,GACT,YAAY,GACZ,sBAAsB,GACtB,WAAW,GACX,aAAa,GACb,YAAY,GACZ,UAAU,GACV,aAAa,GACb,aAAa,GACb,YAAY,GACZ,WAAW,GACX,eAAe,GACf,eAAe,GACf,OAAO,GACP,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,EAu8E1C,CAAC"}
+{"version":3,"file":"usage.generated.d.ts","sourceRoot":"","sources":["../../src/showcase/usage.generated.ts"],"names":[],"mappings":"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"}

package/dist/showcase/usage.generated.js

@@ -230,7 +230,7 @@ export const USAGE = [
         summary: "A card of one setting that says what changing it does and ends in a footer.",
         when: "One setting a person changes on a SettingsPage or as a section of an ObjectPage: Personal details, Company identity, Notifications. A typed value takes `save`; a switch or a short reversible choice applies at once through its own control's change, with no Save. Also a plan-gated feature, a delete card, one read-only value (an ID in a read-only mono InputGroup with its copy button, no Save), and a paid quantity (its stepper field, the price as the description, a two-fact summary under it).",
         instead: "Read-only facts of an object are a SettingsFactsSection; a table or a list of records is a TableCard; Theme and Language live in the account menu; a record's edit in a list is a RowEditForm.",
-        behaviour: '"Groups related form controls inside a bordered card with optional footer actions." (https://vercel.com/geist/fieldset) Ours: one setting per card: a single SettingsField, the description its only help. A typed value (a name, a URL, a server, a port, a key) gets its own card. A semantic subgroup of related controls inside a field, such as radios or checkboxes, is a `FieldSet` with a `FieldLegend`. One more shape exists, declared by a part and never by classes at the call site. A card of several settings holds SettingsRows, label left and control right, only when every row is a switch or every row is a select. "Use Toggle for a single boolean setting where ON takes effect immediately, like `Password Protection` or `Auto-Cancel Builds`." (https://vercel.com/geist/toggle) "Pair with a form footer only when the setting needs an explicit `Save` step." (https://vercel.com/geist/toggle) "Disable Toggle only when the action is impossible (missing plan, locked policy); pair with helper text or a `Tooltip` that names the resolver." (https://vercel.com/geist/toggle) Ours: a switch never applies on change; it is a row of the card, a draft until the footer\'s Save, as Vercel\'s settings cards are. A switch blocked from above is shown off and disabled, the footer saying why and never a tooltip. Required: the title and the description. The header\'s actions stand at the title\'s right; on a card narrower than 28 rem they keep the title\'s row and the description runs under both, as Vercel\'s cards read on a phone, and when the title\'s longest word would not fit beside them they move under the title, so they never cover it. The footer\'s left line (`footerHint`, `save.hint`) is optional and specific to the card, never a generic line repeated on every card: a limit, what a value is for, a plan it needs, a link; absent, it is nothing, and a card with neither a line nor a button has no footer. Ours: `save`: a typed value, one card with its own Save in the footer, always visible. The section owns the changed state: Save stays disabled until a field differs from what is saved and says `pendingLabel` while saving with Cancel beside it; a completed save calls `saved`, and the product raises one toast from its catalogue ("Completion toasts follow `{Noun} {past-participle}`: `Blob deleted`, `Domain added`, `Environment variable saved`. Never include `successfully`; the action name implies it." https://vercel.com/geist/toast), and Save returns to disabled, with no saved state in the footer. Ours: the section never raises a toast itself. A failed save keeps every value and shows under its field, or above the footer when no field owns it. `tone` marks a state with a command (a failed payment, a trial ending): a 1px border and a footer tinted in the hue with its line in it, the line saying the condition in words; title, line, fields and buttons stay neutral, an outline secondary then a default primary. A button takes the hue of its command, not of the card: `destructive` (red) for a permanent loss (Delete), `warning` (amber) for a disruptive command that can be undone (Pause, Archive). A delete card is `tone="error"` with the object\'s summary as its body; an archive card is neutral with a `warning` button in the footer. "Use a Note for inline contextual feedback next to the field, card, or section it describes: a region change warning above a region picker, a rate-limit notice next to a usage gauge." (https://vercel.com/geist/note) "One Note per concept." (https://vercel.com/geist/note) Ours: a message about the fields inside is a MessageNotice in the body, the card staying neutral. "Disabled checkboxes still need a Tooltip naming the reason; a greyed box with no explanation reads as a bug." (https://vercel.com/geist/checkbox) Ours: `lockedReason` (Geist\'s disabled wall) is the reason, written as the footer\'s line, not in a tooltip; it keeps the fields in view, inert with muted text, under a not-allowed cursor, the title and line unchanged; `unlock` is the way to get access, left out when nothing the person does unlocks it. A locked section has no `save` and no header `actions`.',
+        behaviour: '"Groups related form controls inside a bordered card with optional footer actions." (https://vercel.com/geist/fieldset) Ours: one setting per card, a single SettingsField with the description its only help, unless the card\'s description covers several settings: then they are its SettingsRows, switches and selects together. A typed value (a name, a URL, a server, a port, a key) gets its own card. A semantic subgroup of related controls inside a field, such as radios or checkboxes, is a `FieldSet` with a `FieldLegend`. Several settings in one card are declared by SettingsRows, never by classes at the call site. "Use Toggle for a single boolean setting where ON takes effect immediately, like `Password Protection` or `Auto-Cancel Builds`." (https://vercel.com/geist/toggle) "Pair with a form footer only when the setting needs an explicit `Save` step." (https://vercel.com/geist/toggle) "Disable Toggle only when the action is impossible (missing plan, locked policy); pair with helper text or a `Tooltip` that names the resolver." (https://vercel.com/geist/toggle) Ours: a switch never applies on change; it is a row of the card, a draft until the footer\'s Save, as Vercel\'s settings cards are. A switch blocked from above is shown off and disabled, the footer saying why and never a tooltip. Required: the title and the description. The header\'s actions stand at the title\'s right; on a card narrower than 28 rem they keep the title\'s row and the description runs under both, as Vercel\'s cards read on a phone, and when the title\'s longest word would not fit beside them they move under the title, so they never cover it. The footer\'s left line (`footerHint`, `save.hint`) is optional and specific to the card, never a generic line repeated on every card: a limit, what a value is for, a plan it needs, a link; absent, it is nothing, and a card with neither a line nor a button has no footer. Ours: `save`: a typed value, one card with its own Save in the footer, always visible. The section owns the changed state: Save stays disabled until a field differs from what is saved and says `pendingLabel` while saving with Cancel beside it; a completed save calls `saved`, and the product raises one toast from its catalogue ("Completion toasts follow `{Noun} {past-participle}`: `Blob deleted`, `Domain added`, `Environment variable saved`. Never include `successfully`; the action name implies it." https://vercel.com/geist/toast), and Save returns to disabled, with no saved state in the footer. Ours: the section never raises a toast itself. A failed save keeps every value and shows under its field, or above the footer when no field owns it. `tone` marks a state with a command (a failed payment, a trial ending): a 1px border and a footer tinted in the hue with its line in it, the line saying the condition in words; title, line, fields and buttons stay neutral, an outline secondary then a default primary. A button takes the hue of its command, not of the card: `destructive` (red) for a permanent loss (Delete), `warning` (amber) for a disruptive command that can be undone (Pause, Archive). A delete card is `tone="error"` with the object\'s summary as its body; an archive card is neutral with a `warning` button in the footer. "Use a Note for inline contextual feedback next to the field, card, or section it describes: a region change warning above a region picker, a rate-limit notice next to a usage gauge." (https://vercel.com/geist/note) "One Note per concept." (https://vercel.com/geist/note) Ours: a message about the fields inside is a MessageNotice in the body, the card staying neutral. "Disabled checkboxes still need a Tooltip naming the reason; a greyed box with no explanation reads as a bug." (https://vercel.com/geist/checkbox) Ours: `lockedReason` (Geist\'s disabled wall) is the reason, written as the footer\'s line, not in a tooltip; it keeps the fields in view, inert with muted text, under a not-allowed cursor, the title and line unchanged; `unlock` is the way to get access, left out when nothing the person does unlocks it. A locked section has no `save` and no header `actions`.',
         words: '"Helper text is sentence case, one sentence with a trailing period, on a sibling element wired through `aria-describedby`." (https://vercel.com/geist/input) Ours: the description is that helper text for the whole card, and no field has its own. "Render an optional one-sentence description as a sibling under the label that explains ON only. Don’t describe OFF; it’s the negation." (https://vercel.com/geist/toggle) Ours: a header-switch card\'s description says what turning it on does. The title names the values ("Personal details"); the description says what changing them does, in one line; the footer line is a Learn more link, a limit ("Use 32 characters at most."), what stays unaffected, or what is blocked and why ("Ask an owner to change this."); Save and Saving come from the product\'s catalogue, and so does the toast a `saved` callback raises; a delete card\'s description opens "Permanently delete".',
         access: "\"Provide an accessible name through `children`, `aria-label`, or `aria-labelledby`.\" (https://vercel.com/geist/toggle) Ours: the title is the section's h2 and names the form that saves it, and the header switch. The footer's line is one status, announced politely; a failure under a field marks the control invalid and describes it. Locked fields are inert, so the section's title, description and reason are what a screen reader meets.",
     },
@@ -296,8 +296,8 @@ export const USAGE = [
         summary: "A page's actions, drawn on its title's row. Only the page shown last owns the row: a page kept hidden for a quick return gives the row back. Outside a `PageActionsHostProvider`, they render where they stand.",
         when: "The actions of a collection, an object or an overview page, on the title's row at its trailing edge. A Configuration page has none: each section saves from its footer.",
         instead: "A row's actions are the row's one button and its `ActionMenu`. A collection toolbar holds search and filters, never a page action.",
-        behaviour: "Takes `period`, `secondary`, `primary` and `menu` and draws their order and variants itself: the period, outline, default, then the three dots last. The menu needs two commands or more; a single extra command is the secondary. A destination outside the product ends in the arrow. A running command (`pending`) keeps its place and icon, says its pending word and holds, and the type requires `pendingLabel` whenever `pending` is set. A command here is never destructive or warning: those sit in the danger zone of the page, in a card.",
-        words: 'The primary is the page\'s main job as verb and noun: "Invite member", "New Agent". The pending word is its -ing form: "Inviting member". The menu names the page\'s record at its top and keeps the destructive command last, after a divider.',
+        behaviour: 'Takes `period`, `secondary`, `primary` and `menu` and draws their order and variants itself: the period, outline, default, then the three dots last. The menu needs two commands or more; a single extra command is the secondary. A primary whose job comes in a few kinds takes `choices`: its button opens a menu of them aligned to its end, each with its icon, as Vercel\'s "Add New…" does; a kind that needs its own fields opens its dialog from its row. A destination outside the product ends in the arrow. A running command (`pending`) keeps its place and icon, says its pending word and holds, and the type requires `pendingLabel` whenever `pending` is set. A command here is never destructive or warning: those sit in the danger zone of the page, in a card.',
+        words: 'The primary is the page\'s main job as verb and noun: "Invite member", "New Agent". Its choices are the kinds, as nouns: "Folder", "Documents", "Web page". The pending word is its -ing form: "Inviting member". The menu names the page\'s record at its top and keeps the destructive command last, after a divider.',
         access: 'DOM order is visual order. A command whose label does not name its target carries `accessibleName`. A running command is `aria-busy` and keeps focus. The three dots carry "More for {record}"; the menu returns focus to them when it closes.',
     },
     {
@@ -405,7 +405,7 @@ export const USAGE = [
         family: "Inputs",
         summary: "One setting: its label above its control, and what went wrong under it.",
         when: "The one value of a SettingsSection: a name, an address, a choice, a switch.",
-        instead: "A field of a drawer's or a dialog's form is a Field from the form's own owner; a read-only fact is a SettingsFactsSection; several switches or selects in one card are SettingsRows; a switch that is the whole card and applies at once is the section's `headerSwitch`.",
+        instead: "A field of a drawer's or a dialog's form is a Field from the form's own owner; a read-only fact is a SettingsFactsSection; several switches and selects in one card are SettingsRows; a switch that is the whole card and applies at once is the section's `headerSwitch`.",
         behaviour: '"Helper text is sentence case, one sentence with a trailing period, on a sibling element wired through `aria-describedby`." (https://vercel.com/geist/input) Ours: label required, no help line: the card\'s description helps, and the (i) `info` is for a part of a value that needs a sentence. The control is 20rem wide under its label (`controlWidth`: `full` for a textarea, `natural` for a segmented control). `control="choice"` puts a checkbox or radio before its sentence; `control="switch"` puts the word for the switch\'s state after it and requires `stateLabel`. "Validate on blur, not on every keystroke; surface the message by passing a string to `error`." (https://vercel.com/geist/input) Ours: a validation `error` updates as the value is corrected, and it or a failed save about this field shows under the control and marks it invalid; colour sits on the control\'s edge and the message, never the label.',
         words: '"Labels are short Title Case nouns: `Project Name`, `Domain`, `Environment Variable Name`." (https://vercel.com/geist/input) Ours: sentence case, a noun for the value ("Display name"). "Validation names the field and the constraint, ends in a period, and skips `please` (`Project name is required.`, `Code must be 6 digits.`)." (https://vercel.com/geist/input) Ours: an error says what to do next; `info.text` is one sentence and `info.label` names its button ("About display name"); a switch shows its state word ("Enabled", "Disabled") beside it.',
         access: '"Don’t wrap a labelled `<Input>` in a `Tooltip`; put the explainer on a sibling icon button so the label stays announced." (https://vercel.com/geist/input) Ours: that sibling button is the (i) `info`. The control receives its id, `aria-invalid` and `aria-describedby` through `controlProps`, so the label, the info and the error are read with it. The info button has its own name and opens on focus.',
@@ -414,10 +414,10 @@ export const USAGE = [
         name: "SettingsRows",
         module: "settings-section",
         family: "Inputs",
-        summary: "Several switches, or several selects, in one card: each row its label on the left and its control on the right.",
-        when: "A card of settings of one kind, all switches or all selects, that the card's one description covers: a project's Git switches, a team's notification channels, a set of defaults.",
-        instead: "One setting is a SettingsField. Fields of different kinds, text boxes among them, are one card each.",
-        behaviour: 'Declares `kind` once; every row is that kind, so a card cannot mix a switch with a select. Required on every row: the label and its `info` (an (i) with its sentence in a tooltip and on the control); no help line sits under a row. A switch row shows its state word beside the switch (`stateLabels`) and is controlled, so the word always follows the switch. Rows stand 16 px apart; below 28rem a row stacks its control under its label. "Pair with a form footer only when the setting needs an explicit `Save` step." (https://vercel.com/geist/toggle) Ours: a switch is a draft the card\'s Save applies.',
+        summary: "Several switches and selects in one card: each row its label on the left and its control on the right.",
+        when: "A card of switches and selects that the card's one description covers: a project's Git switches, a team's notification channels, a set of defaults, how long a computer stays awake beside whether the window goes to the tray.",
+        instead: "One setting is a SettingsField. A text box is a field of its own card.",
+        behaviour: "A row with `options` is a select, a row with `checked` a switch, and a row with `control` draws a control whose usage page puts it in a row, such as ThemeModeSwitcher; a card may hold any of them together, as Vercel's Root Directory card holds its switches; `stateLabels` is required once any row is a switch. Required on every row: the label and its `info` (an (i) with its sentence in a tooltip and on the control); no help line sits under a row. A switch row shows its state word beside the switch (`stateLabels`) and is controlled, so the word always follows the switch. Rows stand 16 px apart; below 28rem a row stacks its control under its label. \"Pair with a form footer only when the setting needs an explicit `Save` step.\" (https://vercel.com/geist/toggle) Ours: a switch is a draft the card's Save applies.",
         words: '"Title Case noun phrase, 1–4 words, naming what is true when ON: `Password Protection`, not `Enable Password Protection`." (https://vercel.com/geist/toggle) Ours: sentence case, a noun for what it controls ("Pull request comments"), the same for a switch as for a select. "Render an optional one-sentence description as a sibling under the label that explains ON only. Don’t describe OFF; it’s the negation." (https://vercel.com/geist/toggle) Ours: that sentence is `info.text`. "Options are Title Case when short and match canonical branding (`Next.js`, not `NextJS`); keep the same register across the list." (https://vercel.com/geist/select) Ours: a select\'s options are sentence case.',
         access: "Each row's control is named by the row's label and described by its info and its error. The info button has its own name and opens on focus.",
     },
@@ -560,7 +560,7 @@ export const USAGE = [
         summary: "A setting that is on or off.",
         when: '"Use Toggle for a single boolean setting where ON takes effect immediately, like `Password Protection` or `Auto-Cancel Builds`." (https://vercel.com/geist/toggle) Ours: Geist\'s `Toggle` is our `Switch`, inside a settings section.',
         instead: '"Switch to `Checkbox` for a multi-select list, or to `Switch` for 2–3 mutually exclusive views." (https://vercel.com/geist/toggle) Ours: Geist\'s `Switch` is our `SegmentedControl`. Our `Toggle` is a button that stays pressed, and several of them are a `ToggleGroup`. Choosing between named values is a `RadioGroup`.',
-        behaviour: '"`checked` is required and the component is controlled. Own the state and update it from `onChange`." (https://vercel.com/geist/toggle) "Persist on change and surface the result in a `useToasts().success(…)` toast (`Password protection enabled`); don’t leave the user wondering whether the flip stuck." (https://vercel.com/geist/toggle) "Pair with a form footer only when the setting needs an explicit `Save` step." (https://vercel.com/geist/toggle) "Disable Toggle only when the action is impossible (missing plan, locked policy); pair with helper text or a `Tooltip` that names the resolver." (https://vercel.com/geist/toggle) Ours: `checked` is optional, since a switch also runs uncontrolled with `defaultChecked`; the toast is raised with `showMessageToast`; the reason for a disabled switch is written in the card\'s footer, and it is left off. Always named: `aria-label` or `aria-labelledby`, or an `id` that a `FieldLabel`\'s `htmlFor` points at, and a switch with none of them does not compile. A bare `Switch` is the 28 by 14 px track with an 11 px thumb; `md` is 36 by 20 px and `lg` 40 by 24 px. Colour: off is the input grey, on is ink, and a disabled switch turns grey, on or off, with a greyer thumb and no shadow. Space flips it. On a settings page it is a draft its card\'s footer Save applies, and the product\'s toast confirms the save, in one of two places: in the card\'s body under its label, its state word after it (`SettingsField`\'s `control="switch"`); or at the end of a row of a card of several settings, the label to its left. A failed save keeps the draft and says so under the card.',
+        behaviour: '"`checked` is required and the component is controlled. Own the state and update it from `onChange`." (https://vercel.com/geist/toggle) "Persist on change and surface the result in a `useToasts().success(…)` toast (`Password protection enabled`); don’t leave the user wondering whether the flip stuck." (https://vercel.com/geist/toggle) "Pair with a form footer only when the setting needs an explicit `Save` step." (https://vercel.com/geist/toggle) "Disable Toggle only when the action is impossible (missing plan, locked policy); pair with helper text or a `Tooltip` that names the resolver." (https://vercel.com/geist/toggle) Ours: `checked` is optional, since a switch also runs uncontrolled with `defaultChecked`; the toast is raised with `showMessageToast`; the reason for a disabled switch is written in the card\'s footer, and it is left off. Always named: `aria-label` or `aria-labelledby`, or an `id` that a `FieldLabel`\'s `htmlFor` points at, and a switch with none of them does not compile. A bare `Switch` is the 28 by 14 px track with an 11 px thumb; `md` is 36 by 20 px and `lg` 40 by 24 px. Colour: off is the input grey, on is cobalto, the thumb white in both themes, and a disabled switch turns grey, on or off, with a greyer thumb and no shadow. Space flips it. On a settings page it is a draft its card\'s footer Save applies, and the product\'s toast confirms the save, in one of two places: in the card\'s body under its label, its state word after it (`SettingsField`\'s `control="switch"`); or at the end of a row of a card of several settings, the label to its left. A failed save keeps the draft and says so under the card.',
         words: '"The label is `children`, not a `label` prop. Title Case noun phrase, 1–4 words, naming what is true when ON: `Password Protection`, not `Enable Password Protection`." (https://vercel.com/geist/toggle) "Render an optional one-sentence description as a sibling under the label that explains ON only." (https://vercel.com/geist/toggle) "Don’t describe OFF; it’s the negation." (https://vercel.com/geist/toggle) "Keep `labelCasing="title"` (the default) so labels match other Title Case surfaces." (https://vercel.com/geist/toggle) "Use `labelCasing="normal"` only when sentence-case content sits inline next to the toggle." (https://vercel.com/geist/toggle) Ours: the label is 12 px at medium weight, in sentence case: *Approvals*, with the card\'s description in one sentence. The state word is a separate word beside the switch, not its name.',
         access: '"Provide an accessible name through `children`, `aria-label`, or `aria-labelledby`." (https://vercel.com/geist/toggle) "Geist warns in development if all three are missing." (https://vercel.com/geist/toggle) "Set `aria-label` only when the visible label sits elsewhere on the row; otherwise let `children` carry it so sighted and screen-reader copy stay aligned." (https://vercel.com/geist/toggle) Ours: `role="switch"` with `aria-checked`, the name the same in both states; a missing name does not compile.',
     },
@@ -580,7 +580,7 @@ export const USAGE = [
         module: "theme-mode-switcher",
         family: "Choices",
         summary: "The three appearances side by side, each with its glyph and its name.",
-        when: "An Appearance setting on a settings page, where the choice has room to show its names.",
+        when: "An Appearance setting on a settings page, where the choice has room to show its names: its own field, or a row of a SettingsRows card, `compact`, beside settings of the same card.",
         instead: "Inside a menu, the same choice is ThemeModeMenu; a choice that is not the appearance is a RadioGroup or a ToggleGroup.",
         behaviour: "Exclusive: one mode is selected; on a settings card the choice is a draft the card's Save applies. The order is System, Light, Dark everywhere.",
         words: 'The setting\'s name, then each mode\'s name from the product\'s catalogue: "System", "Light", "Dark".',
@@ -678,8 +678,8 @@ export const USAGE = [
         name: "BrandWordmark",
         module: "brand",
         family: "Status",
-        summary: "The company logo: nadicode in full.",
-        when: "Wherever the company is named by its logo: the Portal's sidebar, the website's header, a footer. `BrandMark`, the plain n, where the name does not fit.",
+        summary: "The wordmark: nadicode in full.",
+        when: "Wherever the company is named: the Portal's sidebar, the website's header, a footer. `BrandMark`, the n, where the company is recognised by its sign or the name does not fit; never the two side by side.",
         instead: "A product's own mark (Nadia, Alveare) is that product's. A platform's is `PlatformMark`. The company named in a sentence is text.",
         behaviour: "The letters take the text colour of what they sit in, so one form serves every ground. The dot is the logo's own colour, which turns to the brighter cobalt under any dark ancestor.",
         words: "None beyond its name, *nadicode*, written as the glossary defines it.",
@@ -714,7 +714,7 @@ export const USAGE = [
         summary: "What says which thing a record is, at a fixed size at the start of its row, its object's head or its feed line: an Agent's orb, an app's logo, a model maker's mark, a company's logo or initials, a person's picture, or a record kind's icon on its tile.",
         when: "The first thing in a record's row (32), at the head of its object page (64), in a feed or a sidebar identity line (24), on a Library entry (40), for the company at the top of Nadia's list (28): wherever it tells a person which thing they are looking at.",
         instead: "An icon beside a card's title, a KPI's label or a section heading only repeats the words and is left out. A picture for a first use or a whole-page moment is the empty state's or the page's own. A model is its `ModelIdentity`; a maker's mark beside a model's name in a list of models is `ModelMark` at 24.",
-        behaviour: "Static, except an Agent's orb, which moves with her state. An Agent is always her real orb from the orb engine, at the largest orb size not above the mark's, with no tile and no ring, never an avatar or a painted circle, and `frame` lets the product wrap that orb, such as in the transition that carries her to her page; an app keeps its own logo in its bordered tile on the page ground, or its first letter when it has no logo; a record that belongs to a model maker, such as a key held at that maker, is the maker's `ModelMark` at the mark's size, with its initials when LobeHub has no mark for it; a company is its own logo, contained whole in its original colours and proportions on a dark ringed tile, as Vercel shows a project's favicon, and until a logo is found, or when the stored logo does not load, its initials in white on that same tile, so a found logo only replaces the letters; a company's mark is the same whatever its standing and whichever directory opened it, and a Partner is said in words where its standing matters, never by a colour; a person is their picture, then their initials, in a round mark; a record with its own object picture, such as a Library skill or plugin, draws that picture on its kind's ground; a record with no picture of its own takes its kind's own icon, the same icon its section has in the navigation (Mail for a mailbox, a server for an MCP server, a key for a password), in a ringed tile on the card ground; a Library skill takes the purple category ground with the Skills icon and a plugin the `info-soft` ground with the Plugins icon, both without a ring, so the ground says which kind it is, and an entry that has its own object picture draws it on that ground in the icon's place. A record tile takes `{rounded.sm}` (6 px) corners, `{rounded.md}` (8 px) at 40 and 64; a company's tile and an app's tile take `{rounded.md}` at every size.",
+        behaviour: "Static, except an Agent's orb, which moves with her state. An Agent is always her real orb from the orb engine, at the largest orb size not above the mark's, with no tile and no ring, never an avatar or a painted circle, and `frame` lets the product wrap that orb, such as in the transition that carries her to her page; an app keeps its own logo in its bordered tile on the page ground, or its first letter when it has no logo; a record that belongs to a model maker, such as a key held at that maker, is the maker's `ModelMark` at the mark's size, with its initials when LobeHub has no mark for it; a company is its own logo, contained whole in its original colours and proportions on a dark ringed tile, as Vercel shows a project's favicon, and until a logo is found, or when the stored logo does not load, its initials in white on that same tile, so a found logo only replaces the letters; a company's mark is the same whatever its standing and whichever directory opened it, and a Partner is said in words where its standing matters, never by a colour; a person is their picture, then their initials, in a round mark; a record with no picture of its own takes its kind's own icon, the same icon its section has in the navigation (Mail for a mailbox, a server for an MCP server, a key for a password), in a ringed tile on the card ground; a skill takes the icon its hub card names, and the Skills icon when it names none, on that same neutral ringed tile, so the icon alone tells one skill from another and no colour stands for the kind; a plugin takes the `info-soft` ground with the Plugins icon, without a ring; a record's own object picture, such as a Library skill's or plugin's, is drawn only at 64, at the head of its own page, on its kind's ground in the icon's place, because at a row's size its detail does not read. A record tile takes `{rounded.sm}` (6 px) corners, `{rounded.md}` (8 px) at 40 and 64; a company's tile and an app's tile take `{rounded.md}` at every size.",
         words: "None of its own: the record's name stands beside it. Initials stand for a company or a person: the first letters of the name's first two words. An app with no logo takes the first letter of its name as a monogram, a model maker with no mark the initials of its slug, and no other kind takes letters.",
         access: "Decorative beside the record's name. Alone, as in a narrow rail, `label` names it.",
     },

package/dist/standalone/index.js

@@ -1,3 +1,3 @@
 export const agentOrbScript = "\"use strict\";(()=>{function et(t,o,e){return t+(o-t)*e}function Dt(t){return t-Math.floor(t)}function ot(t,o){let e=Math.floor(t),s=Math.floor(o),n=t-e,r=o-s;n=n*n*(3-2*n),r=r*r*(3-2*r);let a=W(e,s),l=W(e+1,s),d=W(e,s+1),u=W(e+1,s+1);return a+(l-a)*n+(d-a)*r+(a-l-d+u)*n*r}function W(t,o){let e=Math.sin(t*12.9898+o*78.233)*43758.5453;return e-Math.floor(e)}function st(t,o){let e=Math.PI*(3-Math.sqrt(5)),s=1-2*(t+.5)/o,n=Math.sqrt(1-s*s),r=t*e;return[n*Math.cos(r),s,n*Math.sin(r)]}function Zt(t,o){return Math.atan2(Math.sin(t-o),Math.cos(t-o))}function q(t,o,e,s,n){let r=Math.sin(o),a=Math.cos(o),l=Math.sin(t),d=Math.cos(t);return(u,p,m)=>{let c=u*d+m*l,h=-u*l+m*d,M=p*a-h*r,x=p*r+h*a;return[e+c*n,s-M*n,x]}}function Ot(t,o,e,s){if(!s){let r=Math.round((e?1-t:t)*255);return`rgba(${r},${r},${r},${o})`}let n=r=>Math.round(e?r*(1-t):r+(255-r)*t);return`rgba(${n(s.r)},${n(s.g)},${n(s.b)},${o})`}function Pt(t,o,e,s=.3,n){for(let r of o){let a=r.a??1,l=Math.min(1,Math.max(0,r.white));t.fillStyle=Ot(l,a,e,n),t.beginPath(),t.arc(r.x,r.y,r.r,0,Math.PI*2),t.fill()}}function Et(t,o,e,s){for(let n of o){let r=n.a??1,a=Math.min(1,Math.max(0,n.white));t.strokeStyle=Ot(a,r,e,s),t.lineWidth=n.w,t.beginPath(),t.moveTo(n.x1,n.y1),t.lineTo(n.x2,n.y2),t.stroke()}}function j(t,o,e=.3){let s=[];for(let n of t)(n.a??1)<.02||(n.r=Math.max(e,n.r),s.push(n));return s.sort((n,r)=>n.z-r.z),{dots:s,lines:o.filter(n=>(n.a??1)>=.02)}}function kt(t,o,e,s){o.lines.length&&Et(t,o.lines,e,s),Pt(t,o.dots,e,.3,s)}function K(t,o){return(t/300)**o}var Jt=[[\"latRings\",\"lonDensity\"],[\"rings\",\"lonDensity\"],[\"lanes\",\"segs\"]],Qt=[\"orbitN\",\"ghostN\",\"nodeN\",\"strandN\",\"signals\"],Xt=[\"iconD\"],te=[\"rBase\",\"rDepth\",\"rActive\",\"rDot\",\"ghostR\",\"partR\",\"partRDepth\",\"nodeR\",\"nodeRDepth\"];function ee(t,o){let e={...t},s=new Set,n=Math.sqrt(o);for(let[r,a]of Jt){let l=e[r],d=e[a];l!=null&&d!=null&&!s.has(r)&&!s.has(a)&&(e[r]=Math.max(2,Math.round(l*n)),e[a]=Math.max(2,Math.round(d*n)),s.add(r),s.add(a))}for(let r of Qt){let a=e[r];a!=null&&a!==0&&!s.has(r)&&(e[r]=Math.max(1,Math.round(a*o)))}for(let r of Xt){let a=e[r];a!=null&&(e[r]=Math.max(.02,a*o))}return e}function oe(t,o){let e={...t};for(let s of te){let n=e[s];n!=null&&(e[s]=n*o)}return e.rSizeMul=(e.rSizeMul??1)*o,e}var ne={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}},re=(t,o,e)=>{let s=t/2,n=t/2,r=t/2*.76,a=q(o*.4,.3,s,n,1),l=K(t,e.rsPow??.6),d=[],u=e.ghostN??150;for(let c=0;c<u;c++){let h=st(c,u),[M,x,i]=a(h[0]*r,h[1]*r,h[2]*r),S=(i/r+1)/2;d.push({x:M,y:x,z:i,r:.8*l,white:.78,a:.1+.22*S})}let p=e.strandN??52,m=e.turns??3;for(let c=0;c<3;c++){let h=c/3*2*Math.PI;for(let M=0;M<p;M++){let x=(Dt(M/p+o*.045)*2-1)*.96,i=Math.sqrt(Math.max(0,1-x*x)),S=Math.min(1,(1-Math.abs(x))/.1),y=x*Math.PI*m+h,b=1+.075*Math.sin(x*Math.PI*m*2+h*2+o*.8),A=i*r*b,[v,D,g]=a(Math.cos(y)*A,x*r*b,Math.sin(y)*A),f=(g/r+1)/2;d.push({x:v,y:D,z:g,r:((e.rBase??1.2)+(e.rDepth??1.8)*f)*l,white:.55-.45*f,a:S*(.45+.55*f)})}}return j(d,[],e.rMin)};function se(t,o,e,s){let n=2*o*e+s,r=t%n,a=new Array(o).fill(0),l=-1;if(r<2*o*e){let d=Math.floor(r/e),u=(r-d*e)/e,m=1-(1-Math.min(1,u/.7))**3;if(d<o){for(let c=0;c<d;c++)a[c]=1;a[d]=m,l=d}else{let c=2*o-1-d;for(let h=0;h<c;h++)a[h]=1;a[c]=1-m,l=c}}return{amount:a,active:l}}function ae(t,o,e){let[s,n,r]=t,a=!1;for(let l=0;l<o.length;l++){if(e.amount[l]<=0)continue;let d=o[l],u=d.axis===0?s:d.axis===1?n:r;if(u<d.lo||u>=d.hi)continue;l===e.active&&(a=!0);let p=d.ang*e.amount[l],m=Math.cos(p),c=Math.sin(p);if(d.axis===0){let h=n*m-r*c;r=n*c+r*m,n=h}else if(d.axis===1){let h=s*m+r*c;r=-s*c+r*m,s=h}else{let h=s*m-n*c;n=s*c+n*m,s=h}}return[s,n,r,a]}function ie(t){let o=[];for(let e=0;e<t;e++){let s=Math.min(2,Math.floor(W(e,2.3)*3)),n=-1+.5*Math.min(3,Math.floor(W(e,5.9)*4)),r=W(e,7.7)<.5?1:-1;o.push({axis:s,lo:n,hi:n+.5,ang:r*Math.PI/2})}return o}var ce=(t,o,e)=>{let n=t/2,r=t/2,a=t/2*.82,l=.4+.06*Math.sin(o*.35),d=q(o*.5,l,n,r,a),u=o*(.5+(1.7-.5)*(e.scanMul??1)),p=K(t,e.rsPow??.6),m=e.dimBase??1,c=[],h=e.latRings??17,M=e.lonDensity??44;for(let x=0;x<=h;x++){let i=-Math.PI/2+x/h*Math.PI,S=Math.cos(i),y=Math.sin(i),b=Math.max(1,Math.round(Math.abs(S)*M));for(let A=0;A<b;A++){let v=A/b*2*Math.PI,[D,g,f]=d(S*Math.cos(v),y,S*Math.sin(v)),w=(f+1)/2,O=Zt(v+o*.5,u),E=Math.exp(-(O*O)/.18)*Math.max(0,f);c.push({x:D,y:g,z:f,r:((e.rBase??.6)+(e.rDepth??1.7)*w+(e.rBoost??1)*E)*p,white:(e.inkFar??.62)-(e.inkSpan??.54)*w,a:m+(1-m)*Math.min(1,E)})}}return j(c,[],e.rMin)},le=(t,o,e)=>{let s=t/2,n=t/2,r=t/2*.82,a=q(o*.55,.35+.1*Math.sin(o*.9),s,n,r),l=K(t,e.rsPow??.6),d=e.moveCount??14,u=ie(d),p=se(o,d,.42,1.2),m=[],c=e.latRings??15,h=e.lonDensity??40;for(let M=0;M<=c;M++){let x=-Math.PI/2+M/c*Math.PI,i=Math.cos(x),S=Math.sin(x),y=Math.max(1,Math.round(Math.abs(i)*h));for(let b=0;b<y;b++){let A=b/y*2*Math.PI,[v,D,g,f]=ae([i*Math.cos(A),S,i*Math.sin(A)],u,p),[w,O,E]=a(v,D,g),k=(E+1)/2;m.push({x:w,y:O,z:E,r:((e.rBase??.6)+(e.rDepth??1.7)*k+(f?e.rActive??.3:0))*l,white:(e.inkFar??.62)-(e.inkSpan??.54)*k-(f?.14:0)})}}return j(m,[],e.rMin)},pe=(t,o,e)=>{let s=t/2,n=t/2,r=t/2*.874,a=q(o*.18,.38,s,n,1),l=K(t,e.rsPow??.6),d=[],u=e.rings??15,p=e.lonDensity??40;for(let m=0;m<=u;m++){let c=-Math.PI/2+m/u*Math.PI,h=Math.cos(c),M=Math.sin(c),x=.62*Math.sin(o*2.1-m*.52)+.38*Math.sin(o*1.27+m*.83),i=r*(.88+.105*x),S=Math.max(1,Math.round(Math.abs(h)*p));for(let y=0;y<S;y++){let b=y/S*2*Math.PI,[A,v,D]=a(h*Math.cos(b)*i,M*i,h*Math.sin(b)*i),g=(D/r+1)/2,f=Math.max(0,x);d.push({x:A,y:v,z:D,r:((e.rBase??.6)+(e.rDepth??1.7)*g)*(1+.4*f)*l,white:.66-.56*g-.1*f})}}return j(d,[],e.rMin)};function fe(t){return t*t*(3-2*t)}function Tt(t){let o=t.length,e=[],s=0;for(let n=0;n<o;n++){let r=t[n],a=t[(n+1)%o],l=Math.hypot(a[0]-r[0],a[1]-r[1]);e.push(l),s+=l}return n=>{let r=n*s,a=0;for(;r>e[a]&&a<o-1;)r-=e[a],a++;let l=t[a],d=t[(a+1)%o],u=e[a]?Math.min(1,r/e[a]):0;return[l[0]+(d[0]-l[0])*u,l[1]+(d[1]-l[1])*u]}}var ue=t=>{let o=-Math.PI/2+t*2*Math.PI;return[Math.cos(o)*.24,Math.sin(o)*.24]},me=Tt([[0,-.26],[.24,.16],[-.24,.16]]),de=Tt([[0,-.2],[.2,-.2],[.2,.2],[-.2,.2],[-.2,-.2]]),nt=[ue,me,de];function he(t){return Math.max(6,Math.round(34*t))}var rt=1.4,Rt=.9,Y=rt+Rt,ge=(t,o,e)=>{let s=nt.length,n=o%(Y*s),r=e.shape!=null&&e.shape>=0&&e.shape<s?Math.floor(e.shape):-1,a=r>=0?r:Math.floor(n/Y),l=r>=0?o%Y:n-a*Y,d=r>=0?0:l>rt?fe((l-rt)/Rt):0,u=e.spread??1,p=nt[a],m=r>=0?p:nt[(a+1)%s],c=160,h=[];for(let g=0;g<c;g++){let f=g/c,w=p(f),O=m(f);h.push([(w[0]+(O[0]-w[0])*d)*u,(w[1]+(O[1]-w[1])*d)*u])}let M=[],x=0;for(let g=0;g<c;g++){let f=h[g],w=h[(g+1)%c],O=Math.hypot(w[0]-f[0],w[1]-f[1]);M.push(O),x+=O}let i=he(e.iconD??1),S=(e.rDot??.021)*1.35*u,y=1+.02*Math.sin(l*3.1),b=[],A=t/2,v=0,D=0;for(let g=0;g<i;g++){let f=g/i*x;for(;D+M[v]<f&&v<c-1;)D+=M[v],v++;let w=h[v],O=h[(v+1)%c],E=M[v]?Math.min(1,(f-D)/M[v]):0,k=(w[0]+(O[0]-w[0])*E)*y,T=(w[1]+(O[1]-w[1])*E)*y;b.push({x:A+k*t,y:A+T*t,z:0,r:Math.max(.35,S*t),white:.1})}return j(b,[],e.rMin)},Me=(t,o,e)=>{let s=t/2,n=t/2,r=t/2*.82,a=q(o*.12,.3,s,n,1),l=K(t,e.rsPow??.6),d=[],u=e.orbitN??12,p=e.ghostN??40,m=e.particles??3;for(let c=0;c<u;c++){let h=W(c,1.7),M=W(c,5.2),x=W(c,8.9),i=r*(.45+.52*h),S=h*2*Math.PI,y=Math.acos(2*M-1),b=Math.sin(y)*Math.cos(S),A=Math.cos(y),v=Math.sin(y)*Math.sin(S),D=-A,g=b,f=0,w=Math.max(1e-6,Math.sqrt(D*D+g*g));D/=w,g/=w;let O=A*f-v*g,E=v*D-b*f,k=b*g-A*D,T=(.25+.55*x)*(x>.5?1:-1);for(let C=0;C<p;C++){let R=C/p*2*Math.PI,[I,B,L]=a((D*Math.cos(R)+O*Math.sin(R))*i,(g*Math.cos(R)+E*Math.sin(R))*i,(f*Math.cos(R)+k*Math.sin(R))*i),N=(L/i+1)/2;d.push({x:I,y:B,z:L,r:(e.ghostR??.9)*l,white:.72,a:(e.ghostA??.5)*(.4+.6*N)})}for(let C=0;C<m;C++){let R=o*T+C/m*2*Math.PI+M*6,[I,B,L]=a((D*Math.cos(R)+O*Math.sin(R))*i,(g*Math.cos(R)+E*Math.sin(R))*i,(f*Math.cos(R)+k*Math.sin(R))*i),N=(L/i+1)/2;d.push({x:I,y:B,z:L,r:((e.partR??1.2)+(e.partRDepth??1.6)*N)*l,white:.3-.22*N})}}return j(d,[],e.rMin)},wt=(t,o,e)=>{let s=t/2,n=t/2,r=t/2*.78,a=e.spin??1,l=.3,d=q(o*.1*a,l,s,n,1),u=K(t,e.rsPow??.6),p=[],m=e.ghostN??150;for(let k=0;k<m;k++){let T=st(k,m),[C,R,I]=d(T[0]*r,T[1]*r,T[2]*r),B=(I/r+1)/2;p.push({x:C,y:R,z:I,r:.8*u,white:.78,a:.1+.22*B})}let c=o*.24*a,h=e.faceOn?-l:.55+.3*Math.sin(o*.18)*a,M=Math.cos(c),x=0,i=Math.sin(c),S=-i*Math.sin(h),y=Math.cos(h),b=M*Math.sin(h),A=x*b-i*y,v=i*S-M*b,D=M*y-x*S,g=.23*(e.wobMul??1),f=e.faceOn?r/(1+.85*g):r,w=e.lanes??5,O=e.segs??88,E=Math.max(1,Math.round(w*(e.bandMul??1)));for(let k=0;k<E;k++){let T=(k-(E-1)/2)*.075,C=Math.abs(k-(E-1)/2)/Math.max(1,(E-1)/2);for(let R=0;R<O;R++){let I=R/O*2*Math.PI,B=(.16*Math.sin(I*3-o*1.7+k*.22)+.07*Math.sin(I*5+o*1.1))*(e.wobMul??1),L=e.faceOn?1+B:1,N=e.faceOn?T:T+B,_=M*Math.cos(I)+S*Math.sin(I)+A*N,P=x*Math.cos(I)+y*Math.sin(I)+v*N,V=i*Math.cos(I)+b*Math.sin(I)+D*N,F=Math.sqrt(_*_+P*P+V*V),G=f*L,[Ut,Yt,St]=d(_/F*G,P/F*G,V/F*G),tt=(St/r+1)/2;p.push({x:Ut,y:Yt,z:St,r:((e.rBase??1.1)+(e.rDepth??1.7)*tt)*(1-.25*C)*u,white:.52-.44*tt+.18*C,a:.4+.6*tt})}}return j(p,[],e.rMin)},be=(t,o,e)=>{let s=t/2,n=t/2,r=t/2*.8*(e.spread??1),a=q(o*.12,.32,s,n,r),l=K(t,e.rsPow??.6),d=e.nodeN??30,u=e.thr??.72,p=e.nodeR??1.4,m=e.nodeRDepth??1.8,c=[];for(let i=0;i<d;i++){let S=st(i,d),y=S[0]+.3*(ot(i*.31+9,o*.24)-.5)*2,b=S[1]+.3*(ot(i*.53+27,o*.21)-.5)*2,A=S[2]+.3*(ot(i*.77+55,o*.27)-.5)*2,v=Math.sqrt(y*y+b*b+A*A);c.push([y/v,b/v,A/v])}let h=[],M=[];for(let i=0;i<d;i++)for(let S=i+1;S<d;S++){let y=c[i][0]-c[S][0],b=c[i][1]-c[S][1],A=c[i][2]-c[S][2],v=Math.sqrt(y*y+b*b+A*A);if(v>=u)continue;let[D,g,f]=a(c[i][0],c[i][1],c[i][2]),[w,O,E]=a(c[S][0],c[S][1],c[S][2]),k=((f+E)/2+1)/2;h.push({x1:D,y1:g,x2:w,y2:O,white:.42,a:(1-v/u)*(.3+.55*k),w:Math.max(.6,(e.lineW??.8)*l)})}for(let i=0;i<d;i++){let[S,y,b]=a(c[i][0],c[i][1],c[i][2]),A=(b+1)/2,v=1+.25*Math.sin(o*1.4+i*2.7);M.push({x:S,y,z:b,r:(p+m*A)*v*l,white:.55-.45*A})}let x=e.signals??5;for(let i=0;i<x;i++){let S=Math.floor(o*.55+i*7.31),y=Math.floor(W(S,i*3.1+1.7)*d),b=Math.floor(W(S,i*5.7+4.2)*d);if(y===b)continue;let A=Dt(o*.55+i*7.31),v=et(c[y][0],c[b][0],A),D=et(c[y][1],c[b][1],A),g=et(c[y][2],c[b][2],A),f=Math.max(1e-6,Math.sqrt(v*v+D*D+g*g)),[w,O,E]=a(v/f,D/f,g/f),k=(E+1)/2;M.push({x:w,y:O,z:E,r:(p*1.5+m*k)*l,white:.05,a:.5+.5*k})}return j(M,h,e.rMin)},Z={orbits:Me,globe:ce,rubik:le,wave:pe,web:be,braid:re,ribbon:wt,ring:wt,morph:ge},xe=Object.fromEntries(Object.entries(Z).map(([t,o])=>[t,(e,s,n,r,a)=>kt(e,o(s,n,a),r)])),Ct={working:\"orbits\",searching:\"globe\",solving:\"rubik\",listening:\"wave\",connecting:\"web\",weaving:\"braid\",composing:\"ribbon\",breathing:\"ring\",shaping:\"morph\"},ye={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}}}},At=new Map;function at(t,o){let e=`${t}-${o}`,s=At.get(e);if(s)return s;let n=Ct[t],r=ye[n][o],a={...ne[n]};r.count!==1&&(a=ee(a,r.count)),r.size!==1&&(a=oe(a,r.size)),r.extra&&(a={...a,...r.extra});let l={mode:n,speed:r.speed,opts:a};return At.set(e,l),l}var it=(t,o,e)=>e>o?o:e<t?t:e;var ct=()=>{};var H=t=>t*1e3,$=t=>t/1e3;var Vt=(t,o,e=10)=>{let s=\"\",n=Math.max(Math.round(o/e),2);for(let r=0;r<n;r++)s+=Math.round(t(r/(n-1))*1e4)/1e4+\", \";return`linear(${s.substring(0,s.length-2)})`};function J(t,o=50,e=2e4,s){let n=0,r=t.next(n);for(s?.push(r.value);!r.done&&n<e;)n+=o,r=t.next(n),s?.push(r.value);return n>=e?1/0:n}function It(t,o=100,e){let{keyframes:s,velocity:n}=t,r=s&&s[s.length-1]-s[0],a=e({...t,velocity:n&&r?n*o/r:n,keyframes:[0,o]}),l=Math.min(J(a),2e4);return{type:\"keyframes\",ease:d=>a.next(l*d).value/o,duration:$(l)}}var z={stiffness:100,damping:10,mass:1,duration:800,bounce:.3,visualDuration:.3,restSpeed:{granular:.01,default:2},restDelta:{granular:.005,default:.5},minDuration:.01,maxDuration:10,minDamping:.05},Ft=t=>t<0?1/Math.max(1+t,z.minDamping):Math.max(1-t,z.minDamping);function zt(t,o){if(!(t>1))return 1;let e=Math.sqrt(t*t-1),s=t-e,n=t+e,r=2*e*Math.exp(-o)*(1+o);return Nt(a=>n*Math.exp(-s*a)-s*Math.exp(-n*a)-r,a=>Math.exp(-n*a)-Math.exp(-s*a),o)/o}function ut(t,o){return t*Math.sqrt(1-o*o)}var ve=12;function Nt(t,o,e){let s=e;for(let n=1;n<ve;n++)s=s-t(s)/o(s);return s}var pt=.001;function Se({duration:t=z.duration,bounce:o=z.bounce}){let e,s;ct(t<=H(z.maxDuration),\"Spring duration must be 10 seconds or less\",\"spring-duration-limit\");let n=Ft(o);t=it(z.minDuration,z.maxDuration,$(t)),n<1?(e=u=>{let p=u*n,m=p*t,c=ut(u,n),h=Math.exp(-m);return pt-p/c*h},s=u=>{let m=u*n*t,c=n*n*u*u*t,h=Math.exp(-m),M=ut(u*u,n);return(-e(u)+pt>0?-1:1)*-c*h/M}):(e=u=>{let p=Math.exp(-u*t),m=u*t+1;return-pt+p*m},s=u=>{let p=Math.exp(-u*t),m=-u*(t*t);return p*m});let r=5/t,a=Nt(e,s,r),l=a*zt(n,a*t),d=l*l;return{stiffness:d,damping:n*2*Math.sqrt(d),duration:H(t)}}var mt=(t,o)=>(o?t>=0:t>0)&&t<1/0;function ft(t,o){if(mt(t,o))return t}function we(t){let o=ft(t.stiffness),e=ft(t.damping,!0),s=ft(t.mass),n={...t,stiffness:o??z.stiffness,damping:e??z.damping,mass:s??z.mass,isResolvedFromDuration:!1,isTimeDefined:(o??e??s)===void 0&&(t.duration!==void 0||t.bounce!==void 0)};if(n.isTimeDefined){if(t.visualDuration){let r=Ft(t.bounce||0),a=2*Math.PI/(t.visualDuration*1.2)*zt(r,2*Math.PI/1.2);n.stiffness=a*a,n.damping=2*r*Math.sqrt(n.stiffness)}else Object.assign(n,Se(n)),n.isResolvedFromDuration=!0;(!mt(n.stiffness)||!mt(n.damping,!0))&&(n.stiffness=z.stiffness,n.damping=z.damping)}return n}function U(t=z.visualDuration,o=z.bounce){let e=typeof t!=\"object\"?{visualDuration:t,keyframes:[0,1],bounce:o}:t,s=e.keyframes[0],n=e.keyframes[e.keyframes.length-1],r={done:!1,value:s},{stiffness:a,damping:l,mass:d,duration:u,isResolvedFromDuration:p,isTimeDefined:m}=we({...e}),c=g=>m?0:-$(g),h=l/(2*Math.sqrt(a*d)),M=$(Math.sqrt(a/d)),x=h*M,i={target:n,delta:n-s,velocity:c(e.velocity||0)||0,restSpeed:0,restDelta:0},S=()=>{let g=Math.abs(i.delta)<5;i.restSpeed=e.restSpeed||(g?z.restSpeed.granular:z.restSpeed.default),i.restDelta=e.restDelta||(g?z.restDelta.granular:z.restDelta.default)};S();let y,b,A;if(h<1){let g=ut(M,h),f={A:0,sinC:0,cosC:0,t:-1,env:0,sin:0,cos:0};A=()=>{f.A=(i.velocity+x*i.delta)/g,f.sinC=x*f.A+i.delta*g,f.cosC=x*i.delta-f.A*g};let w=O=>{O!==f.t&&(f.t=O,f.env=Math.exp(-x*O),f.sin=Math.sin(g*O),f.cos=Math.cos(g*O))};y=O=>(w(O),i.target-f.env*(f.A*f.sin+i.delta*f.cos)),b=O=>(w(O),f.env*(f.sinC*f.sin+f.cosC*f.cos))}else if(h===1){y=f=>i.target-Math.exp(-M*f)*(i.delta+(i.velocity+M*i.delta)*f);let g={C:0};A=()=>{g.C=i.velocity+M*i.delta},b=f=>Math.exp(-M*f)*(M*g.C*f-i.velocity)}else{let g=M*Math.sqrt(h*h-1),f=x-g,w=x+g,O=m?1/0:300/g,E=(T,C)=>Math.exp(C>O?-T*O-x*(C-O):-T*C),k={S:0,F:0};A=()=>{let T=(i.velocity+x*i.delta)/g;k.S=(i.delta+T)/2,k.F=(i.delta-T)/2},y=T=>i.target-k.S*E(f,T)-k.F*E(w,T),b=T=>f*k.S*E(f,T)+w*k.F*E(w,T)}A();let v=p&&u||null,D={calculatedDuration:v,retarget:(g,f)=>{i.target=g[g.length-1],i.delta=i.target-g[0],i.velocity=c(f),e.restSpeed&&e.restDelta||S(),D.calculatedDuration=v,r.done=!1,A()},velocity:g=>H(b(g)),next:g=>{let f=y(g);if(p)r.done=g>=u;else{let w=H(b(g));r.done=Math.abs(w)<=i.restSpeed&&Math.abs(i.target-f)<=i.restDelta}return r.value=r.done?i.target:f,r},toString:()=>{let g=Math.min(J(D),2e4),f=Vt(w=>D.next(g*w).value,g,30);return g+\"ms \"+f},toTransition:()=>{}};return D}U.applyToOptions=t=>{let o=It(t,100,U);return t.ease=o.ease,t.duration=H(o.duration),t.type=\"keyframes\",t};var Ae={ribbon:{speed:.55},nadia:{speed:.55},sofia:{speed:.55},lattice:{speed:.28},orbit:{speed:.7},globe:{speed:.35},network:{speed:.55},braid:{speed:.65},morph:{speed:.9}};function ht(t){return Ae[t].speed}function Bt(t,o,e=0,s=Mt){return{idle:.864,working:1,thinking:.55,waiting:0,blocked:0,done:e>=s.doneDuration?.72:.65}[t]*ht(o)}var gt={resting:15,busy:30},De=1.6;function Lt(t,o){return t!==\"thinking\"&&t!==\"working\"?1:1-.55*((1-Math.cos(o*Math.PI*2/De))/2)}function X(t){let o=(l,d)=>{let u=t?.getPropertyValue(`--nc-duration-${l}`).trim()??\"\";return u?Number.parseFloat(u)*(u.endsWith(\"ms\")?.001:1):d},e=o(\"wait\",1.6),s=o(\"confirm\",.18),n=o(\"transition\",.24),r=l=>Math.round(e*l*1e3)/1e3,a=U({keyframes:[0,1],duration:n*2e3,bounce:.1});return{wait:e,confirm:s,transition:n,doneDuration:r(3),blockedDuration:r(1.25),gestureAge:l=>l*n*2/e,settle:(l,d=0)=>l<d?0:a.next((l-d)*1e3).value}}var Mt=X(),Q=t=>Math.min(1,Math.max(0,t)),dt=t=>{let o=Q(t);return o*o*(3-2*o)};function Gt(t,o,e=Mt,s=!1){let n=.82,r=.82,a=0,l=0,d=0;if(t===\"idle\"){let u=Math.sin((s?.6:o)*Math.PI*2/(e.wait*4));n+=u*.01,r+=u*.01,a=-u*.004}else if(!s&&t===\"waiting\"){let u=e.gestureAge(o),p=Math.sin(o*Math.PI*2/(e.wait*3)),m=Math.sin(Q(u/e.confirm)*Math.PI),c=e.settle(u,e.confirm*.55),h=1-m*.018+p*.006;n*=h,r*=h,a=-c*.018,d=-c*4.5*Math.PI/180}else if(!s&&t===\"blocked\"){let u=e.gestureAge(o),p=e.confirm*.85,m=dt(u/p)*(1-e.settle(u,p));n*=1-m*.018,r*=1+m*.012,l=-m*.034,a=m*.014,d=-m*4*Math.PI/180}else if(!s&&t===\"done\"){let u=o*1.3/(e.wait*2.25);if(u<.18){let p=Math.sin(Math.PI*u/.18);n+=.03*p,r-=.04*p,a=.012*p}else if(u<1.3){let p=(u-.18)/1.12;a=-.07*Math.sin(Math.PI*p),n+=.025*Math.sin(Math.PI*p),r+=.035*Math.sin(Math.PI*p),d=Math.sin(p*Math.PI*2)*.07}}return{sx:n,sy:r,x:l,y:a,rotation:d}}function Oe(t,o,e,s,n,r,a){let l=a.gestureAge(s),d=n?1:dt((l-a.confirm*.35)/a.confirm),u=n?1:a.settle(l,a.confirm*.35),p=Math.max(7,Math.min(36,e*.26));if(t.save(),t.fillStyle=r,t.strokeStyle=r,t.globalAlpha=d*.95,t.translate(e/2,e/2),o===\"waiting\"){let m=n?0:a.settle(l,a.confirm*.55),c=n?0:Math.sin(s*Math.PI*2/(a.wait*3));t.translate(0,(1-u)*-.12*p),t.rotate(-m*2*Math.PI/180);let h=.94+u*.06;t.scale(h,h),t.scale(p/24,p/24);for(let[M,x]of[14,5].entries()){let i=n?1:a.settle(l,a.confirm*(M===0?.65:.2)),S=M===0?1:-1;t.save(),t.globalAlpha=d*.95*Q(i)*(n?1:.96+c*.04),t.translate(x-9.5+S*(1-i)*1.45*5,(1-i)*-.24*18),t.rotate(S*(1-i)*14*Math.PI/180),t.scale(1,1+(1-i)*.12),t.beginPath(),t.roundRect(-2.5,-9,5,18,1),t.fill(),t.restore()}}else{t.translate(0,(1-u)*-.1*p),t.rotate((1-u)*-12*Math.PI/180);let m=1+(1-u)*.18;t.scale(m,m),t.scale(p/24,p/24),t.lineWidth=Math.max(1.6,24/p),t.lineCap=\"round\",t.beginPath(),t.arc(0,0,10,0,Math.PI*2),t.stroke();let c=n?1:dt((l-a.confirm*.8)/a.confirm);if(t.beginPath(),t.moveTo(-7.071,-7.071),t.lineTo(-7.071+14.141*c,-7.071+14.142*c),t.stroke(),!n&&e>=40){let h=Q((l-a.confirm*.85)/a.transition);t.globalAlpha*=Math.sin(h*Math.PI)*.65,t.lineWidth=1.4*24/p;for(let M of[-1,1]){t.beginPath();let x=M*(14.52+h*5.472),i=M*(10.34+h*1.68);t.moveTo(x-1.612,i-1.612),t.lineTo(x+1.612,i+1.612),t.stroke()}}}t.restore()}function bt(t,o,e,s,n,r,a,l=1,d=Mt,u=r[0]??\"currentColor\"){if(o===\"waiting\"||o===\"blocked\"){a===\"front\"&&Oe(t,o,e,s,n,u,d);return}if(!(o!==\"working\"&&o!==\"thinking\"&&o!==\"done\")){if(s*=o===\"done\"?3.1/d.doneDuration:o===\"working\"?7.2/(d.wait*2):3.6/(d.wait*1.5),t.save(),o===\"thinking\"){if(a===\"front\")for(let p=0;p<3;p++){let m=n?.5:(1+Math.cos(s*Math.PI*2/3.6-p*Math.PI*2/3))/2,c=r[p%r.length];c!==void 0&&(t.fillStyle=c),t.globalAlpha=(.65+m*.35)*l,t.beginPath(),t.arc(e*(.5+(p-1)*.09),e*.08,Math.max(1,e*(.022+m*.005)),0,Math.PI*2),t.fill()}}else if(o===\"working\"||!n&&s<3.1){let p=o===\"done\"?3:1;for(let m=0;m<p;m++){let c=o===\"done\"?(s-m*.38)/2.2:0;if(c<0||c>1)continue;let h=o===\"done\"?Math.sin(c*Math.PI):1,M=(n?.8:s*Math.PI*2/7.2)+m*2.1,x=Math.PI*1.4,i=-.38+m*.4,S=e*(.44+c*.03),y=e*(.19+c*.11),b=v=>{let D=Math.cos(v)*S,g=Math.sin(v)*y;return[e/2+D*Math.cos(i)-g*Math.sin(i),e/2+D*Math.sin(i)+g*Math.cos(i)]},A=t.createLinearGradient(e*.1,e*.7,e*.9,e*.3);r.forEach((v,D)=>A.addColorStop(D/Math.max(1,r.length-1),v)),t.strokeStyle=A,t.lineCap=\"butt\";for(let v=0;v<100;v++){let D=v/100,g=M-x+x*D,f=Math.sin(g)>=0;if(f!==(a===\"front\"))continue;let w=Math.sin(Math.PI*(.04+D*.92));t.globalAlpha=h*(f?.92:.55)*(.25+w*.75)*l,t.lineWidth=Math.max(.65,e*.027*w),t.beginPath(),t.moveTo(...b(g)),t.lineTo(...b(g+x/100)),t.stroke()}}}t.restore()}}var Pe={orbit:\"working\",globe:\"searching\",lattice:\"solving\",network:\"connecting\",braid:\"weaving\",ribbon:\"composing\",morph:\"shaping\"},Ee={plain:{alpha:1,radius:1},\"over-picture\":{alpha:2.3,radius:1.9}},_t=[\"--nc-identity-azzurro\",\"--nc-identity-verde\",null,\"--nc-identity-rosso\"],qt=[\"--nc-acqua-700\",\"--nc-viola-700\",\"--nc-warning\",\"--nc-rosso-700\"],vt={waiting:\"--nc-warning-deep\",blocked:\"--nc-error\"},Wt=new Map,Kt=[\"--nc-identity-cobalto\",\"--nc-identity-giallo\",null,\"--nc-identity-arancio\"],ke={nadia:_t,sofia:Kt},Te=[...qt,...[..._t,...Kt].filter(t=>t!==null),...Object.values(vt),\"--nc-duration-wait\",\"--nc-duration-confirm\",\"--nc-duration-transition\"];function Re(t,o){let e=1-2*(t+.5)/o,s=Math.sqrt(1-e*e),n=t*Math.PI*(3-Math.sqrt(5));return[s*Math.cos(n),e,s*Math.sin(n)]}function jt(t,o,e){let s=t/2,n=t/2*.78,r=e.spin??1,a=q(o*.1*r,.3,s,s,1),l=K(t,e.rsPow??.6),d=[],u=e.ghostN??150;for(let w=0;w<u;w++){let[O,E,k]=Re(w,u),[T,C,R]=a(O*n,E*n,k*n);d.push({x:T,y:C,z:R,r:.8*l,white:.78,a:.1+.22*((R/n+1)/2)})}let p=o*.24*r,m=e.faceOn?-.3:.55+.3*Math.sin(o*.18)*r,[c,h,M]=[Math.cos(p),0,Math.sin(p)],[x,i,S]=[-M*Math.sin(m),Math.cos(m),c*Math.sin(m)],[y,b,A]=[h*S-M*i,M*x-c*S,c*i-h*x],v=e.wobMul??1,D=e.faceOn?n/(1+.85*.23*v):n,g=e.segs??88,f=Math.max(1,Math.round((e.lanes??5)*(e.bandMul??1)));for(let w=0;w<f;w++){let O=(w-(f-1)/2)*.075,E=Math.abs(w-(f-1)/2)/Math.max(1,(f-1)/2);for(let k=0;k<g;k++){let T=k/g*2*Math.PI,C=(.16*Math.sin(T*3-o*1.7+w*.22)+.07*Math.sin(T*5+o*1.1))*v,R=e.faceOn?1+C:1,I=e.faceOn?O:O+C,B=c*Math.cos(T)+x*Math.sin(T)+y*I,L=h*Math.cos(T)+i*Math.sin(T)+b*I,N=M*Math.cos(T)+S*Math.sin(T)+A*I,_=Math.sqrt(B*B+L*L+N*N),[P,V,F]=a(B/_*D*R,L/_*D*R,N/_*D*R),G=(F/n+1)/2;d.push({x:P,y:V,z:F,r:((e.rBase??1.1)+(e.rDepth??1.7)*G)*(1-.25*E)*l,white:.08+.1*E,a:.55+.45*G,stripe:Math.min(3,Math.floor(w/f*4))})}}return j(d,[],e.rMin)}function Ce(t,o){for(let e of t.dots)e.x=o-e.x;return t}function Ve(t){return t<=32?20:t<=48?32:64}function Ht(t,o,e,s){return e===\"ambient\"||t===\"done\"&&o>=s.doneDuration?\"idle\":t}function Ie(t,o){let{form:e,size:s,seconds:n,color:r,state:a,age:l,reduced:d,breath:u,celebrationColors:p,stripeColors:m}=o,c=Ee[o.presence],h=at(Pe[e===\"nadia\"||e===\"sofia\"?\"ribbon\":e],Ve(s)),M=e===\"nadia\"?jt(s,n,h.opts):e===\"sofia\"?Ce(jt(s,n,h.opts),s):Z[h.mode](s,n,h.opts);t.clearRect(0,0,s,s);let x=a===\"done\"&&l>=o.timing.doneDuration,i=Ht(a,l,o.motion,o.timing),S=o.motion===\"ambient\"?0:x?l-o.timing.doneDuration:l,y=Gt(i,S,o.timing,d),b=x?l-o.timing.doneDuration:l,A=i===\"waiting\"||i===\"blocked\"?o.statusColors[i]:r,v=(f,w)=>{let O=(f-s/2)*y.sx,E=(w-s/2)*y.sy;return[s/2+O*Math.cos(y.rotation)-E*Math.sin(y.rotation)+y.x*s,s/2+O*Math.sin(y.rotation)+E*Math.cos(y.rotation)+y.y*s]},D=u;o.motion===\"status\"&&bt(t,i,s,b,d,p,\"back\",u,o.timing,A),t.fillStyle=r,t.strokeStyle=r;for(let f of M.lines)t.globalAlpha=Math.min(1,Math.max(0,(1-f.white)*(f.a??1)*D*c.alpha)),t.lineWidth=f.w*c.radius,t.beginPath(),t.moveTo(...v(f.x1,f.y1)),t.lineTo(...v(f.x2,f.y2)),t.stroke();let g=M.dots;for(let f of g)t.fillStyle=f.stripe===void 0?r:m[f.stripe]??r,t.globalAlpha=Math.min(1,Math.max(0,(1-f.white)*(f.a??1)*D*c.alpha)),t.beginPath(),t.arc(...v(f.x,f.y),f.r*c.radius,0,Math.PI*2),t.fill();t.globalAlpha=1,o.motion===\"status\"&&bt(t,i,s,b,d,p,\"front\",u,o.timing,A)}function Fe(t){let o=new Map,e=window.matchMedia(\"(prefers-reduced-motion: reduce)\");function s(p){let m=h=>{for(let M=h;M;M=M.parentElement)if(p.has(M))return!0;return!1},c=[...o].flatMap(([h,M])=>m(h)?[M.readChange()]:[]);for(let h of c)h?.()}function n(){for(let p of o.values())p.play()}let r=typeof IntersectionObserver>\"u\"?void 0:new IntersectionObserver(p=>{for(let m of p)o.get(m.target)?.setVisible(m.isIntersecting)}),a=new MutationObserver(p=>{s(new Set(p.map(m=>m.target)))});a.observe(document.documentElement,{attributes:!0,attributeFilter:[\"class\",\"style\",\"data-theme\"],subtree:!0});let l=new ResizeObserver(p=>{let m=p.map(c=>o.get(c.target)?.readResize());for(let c of m)c?.()});function d(p){p.propertyName===\"color\"&&p.target instanceof Node&&s(new Set([p.target]))}function u(){s(new Set([document.documentElement]))}return document.addEventListener(\"transitionend\",d,!0),e.addEventListener(\"change\",n),document.addEventListener(\"visibilitychange\",n),window.addEventListener(\"resize\",u),{motion:e,watch(p,m){o.set(p,m),r?.observe(p),l.observe(p)},unwatch(p,m){if(o.get(p)===m){if(o.delete(p),o.size>0){r?.unobserve(p),l.unobserve(p);return}r?.disconnect(),a.disconnect(),l.disconnect(),document.removeEventListener(\"transitionend\",d,!0),e.removeEventListener(\"change\",n),document.removeEventListener(\"visibilitychange\",n),window.removeEventListener(\"resize\",u),t()}}}}var xt;function ze(){let t=new Set,o=0;function e(s){o=0;for(let n of[...t])n(s)||t.delete(n);t.size>0&&o===0&&(o=requestAnimationFrame(e))}return{run(s){t.add(s),o===0&&(o=requestAnimationFrame(e))},stop(s){t.delete(s),!(t.size>0||o===0)&&(cancelAnimationFrame(o),o=0)}}}var yt=ze(),Ne=4;function Be(){return xt??=Fe(()=>{xt=void 0}),xt}var Le=.1;function $t(t,o){let{form:e,presence:s=\"plain\"}=o,n=t.getContext(\"2d\");if(!n)return{destroy(){},setPaused(P){},setState(P){}};let r=Be(),{motion:a}=r,l=o.paused??!1,d=!0,u=!1,p=.6,m=0,c=0,h=o.state??\"idle\",M=o.motion??\"status\",x=null,i=0,S=1,y=o.size,b=getComputedStyle(t).color,A=[b],v=[b],D=\"\",g=X(),f={waiting:b,blocked:b};function w(){let P=t.getBoundingClientRect(),V=Math.min(P.width,P.height);return V>0?V:o.size}function O(){!n||u||!t.isConnected||(n.setTransform(S,0,0,S,0,0),Ie(n,{form:e,size:y,seconds:p,color:b,state:h,age:m,reduced:a.matches,breath:a.matches?Lt(h,c):1,presence:s,motion:M,celebrationColors:A,stripeColors:v,statusColors:f,timing:g}))}function E(){return u||!t.isConnected||!d||document.hidden||l?!1:a.matches?M===\"status\"&&(h===\"thinking\"||h===\"working\"):M===\"ambient\"?!0:!(h===\"blocked\"&&m>=g.blockedDuration)}function k(P){if(!E())return!1;if(x!==null){let F=Math.min((P-x)/1e3,Le);a.matches?c+=F:(p+=F*(M===\"ambient\"?ht(e):Bt(h,e,m,g)),M===\"status\"&&(m+=F))}x=P;let V=Ht(h,m,M,g)===\"idle\"?gt.resting:gt.busy;return(P-i>=1e3/V-Ne||!E())&&(O(),i=P),E()}function T(){x=null,O(),E()?yt.run(k):yt.stop(k)}function C(P){let V=Wt.get(P);if(V)return V;let F=document.createElement(\"span\");F.hidden=!0,F.style.color=P,(t.parentElement??document.body).append(F);let G=getComputedStyle(F).color;return F.remove(),G?(Wt.set(P,G),G):b}function R(){let P=getComputedStyle(t),V=new Map(Te.map(G=>[G,P.getPropertyValue(G).trim()]));return{key:[window.devicePixelRatio||1,P.color,...V.values()].join(\"|\"),color:P.color,tokens:V,timing:X(P)}}function I(P){if(u||!t.isConnected)return;y=P;let V=Math.max(1,Math.round(y*Math.min(window.devicePixelRatio||1,2)));t.width=V,t.height=V,S=V/y,T()}function B(P,V){D=P.key,b=P.color,g=P.timing,f={waiting:C(P.tokens.get(vt.waiting)||b),blocked:C(P.tokens.get(vt.blocked)||b)},A=qt.map(F=>C(`color-mix(in oklch, ${P.tokens.get(F)||b} 75%, white)`)),v=(ke[e]??[]).map(F=>F&&P.tokens.get(F)||b),I(V)}function L(){if(u||!t.isConnected)return;let P=w();return Math.abs(P-y)>=.5?()=>I(P):void 0}function N(){if(u||!t.isConnected)return;let P=R();if(P.key===D)return L();let V=w();return()=>B(P,V)}let _={readChange:N,readResize:L,setVisible(P){d=P,T()},play:T};return r.watch(t,_),N()?.(),{setState(P){h=P,m=0,c=0,T()},setPaused(P){l=P,T()},destroy(){u=!0,yt.stop(k),r.unwatch(t,_)}}}for(let t of document.querySelectorAll(\"canvas[data-agent-orb]\"))$t(t,{form:t.dataset.agentOrb,size:Number(t.dataset.size),state:t.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.5005 0.2804 266.17);\n    --nc-action-foreground: oklch(1.0000 0.0000 0.00);\n    --nc-action-hover: oklch(0.4602 0.2797 266.14);\n    --nc-action-active: oklch(0.4202 0.2522 266.14);\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.9612 0.0000 0.00);\n    --nc-link: oklch(0.5005 0.2804 266.17);\n    --nc-link-deep: oklch(0.4202 0.2522 266.14);\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.1684 0.0000 0.00);\n    --nc-dark-material-modal: oklch(0.1684 0.0000 0.00);\n    --nc-card-graphite: oklch(0.1957 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.5005 0.2804 266.17);\n    --nc-dark-action-foreground: oklch(1.0000 0.0000 0.00);\n    --nc-dark-action-hover: oklch(0.4602 0.2797 266.14);\n    --nc-dark-action-active: oklch(0.4202 0.2522 266.14);\n    --nc-dark-link: oklch(0.7993 0.1005 266.67);\n    --nc-dark-link-deep: oklch(0.8944 0.0509 267.00);\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.5005 0.2804 266.17);\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-button-padding-inline-sm: 6px;\n    --nc-button-padding-inline: 10px;\n    --nc-button-padding-inline-lg: 14px;\n    --nc-card-padding: 20px;\n    --nc-touch-target: 44px;\n    --nc-rounded-none: 0px;\n    --nc-rounded-xs: 2px;\n    --nc-rounded-xs-plus: 4px;\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: 24px;\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: 21px;\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: 80%;\n    --nc-material-dark-scrim-opacity: 60%;\n    --nc-material-glass-opacity: 55%;\n    --nc-material-glass-saturation: 180%;\n    --nc-material-glass-blur: 20px;\n    --nc-elevation-resting: 0px 0px 0px 1px rgb(0% 0% 0% / 0.08), 0px 2px 2px 0px rgb(0% 0% 0% / 0.04);\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 16px -4px rgb(0% 0% 0% / 0.08);\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.06),\n      0px 16px 32px -8px rgb(0% 0% 0% / 0.1);\n    --nc-elevation-modal:\n      0px 0px 0px 1px rgb(0% 0% 0% / 0.08),\n      0px 8px 24px -12px rgb(0% 0% 0% / 0.12),\n      0px 32px 72px -12px rgb(0% 0% 0% / 0.12);\n    --nc-elevation-glass:\n      inset 0px 1px 0px 0px rgb(100% 100% 100% / 0.75),\n      inset 0px 0px 0px 1px rgb(100% 100% 100% / 0.35),\n      0px 0px 0px 1px rgb(0% 0% 0% / 0.08),\n      0px 4px 8px -4px rgb(0% 0% 0% / 0.06),\n      0px 16px 32px -8px rgb(0% 0% 0% / 0.08);\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-material-scrim-opacity: var(--nc-material-dark-scrim-opacity);\n    --nc-elevation-resting:\n      0px 0px 0px 1px rgb(100% 100% 100% / 0.145),\n      0px 0px 0px 2px rgb(0% 0% 0%),\n      0px 1px 2px 0px rgb(0% 0% 0% / 0.5);\n    --nc-elevation-raised:\n      inset 0px 1px 0px 0px rgb(100% 100% 100% / 0.06),\n      0px 0px 0px 1px rgb(100% 100% 100% / 0.16),\n      0px 0px 0px 2px rgb(0% 0% 0%),\n      0px 12px 24px -8px rgb(0% 0% 0% / 0.8);\n    --nc-elevation-floating:\n      inset 0px 1px 0px 0px rgb(100% 100% 100% / 0.08),\n      0px 0px 0px 1px rgb(100% 100% 100% / 0.16),\n      0px 0px 0px 2px rgb(0% 0% 0%),\n      0px 24px 48px -12px rgb(0% 0% 0% / 0.9);\n    --nc-elevation-modal:\n      inset 0px 1px 0px 0px rgb(100% 100% 100% / 0.1),\n      0px 0px 0px 1px rgb(100% 100% 100% / 0.18),\n      0px 0px 0px 2px rgb(0% 0% 0%),\n      0px 48px 96px -24px rgb(0% 0% 0%);\n    --nc-elevation-glass:\n      inset 0px 1px 0px 0px rgb(100% 100% 100% / 0.1),\n      0px 0px 0px 1px rgb(100% 100% 100% / 0.14),\n      0px 16px 32px -12px rgb(0% 0% 0% / 0.8);\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.5005 0.2804 266.17);\n    --nc-action-foreground: oklch(1.0000 0.0000 0.00);\n    --nc-action-hover: oklch(0.4602 0.2797 266.14);\n    --nc-action-active: oklch(0.4202 0.2522 266.14);\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.9612 0.0000 0.00);\n    --nc-link: oklch(0.5005 0.2804 266.17);\n    --nc-link-deep: oklch(0.4202 0.2522 266.14);\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-logo-guide: oklch(0.6830 0.0000 0.00);\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.1684 0.0000 0.00);\n    --nc-dark-material-modal: oklch(0.1684 0.0000 0.00);\n    --nc-card-graphite: oklch(0.1957 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.5005 0.2804 266.17);\n    --nc-dark-action-foreground: oklch(1.0000 0.0000 0.00);\n    --nc-dark-action-hover: oklch(0.4602 0.2797 266.14);\n    --nc-dark-action-active: oklch(0.4202 0.2522 266.14);\n    --nc-dark-link: oklch(0.7993 0.1005 266.67);\n    --nc-dark-link-deep: oklch(0.8944 0.0509 267.00);\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.5005 0.2804 266.17);\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-button-padding-inline-sm: 6px;\n    --nc-button-padding-inline: 10px;\n    --nc-button-padding-inline-lg: 14px;\n    --nc-card-padding: 20px;\n    --nc-touch-target: 44px;\n    --nc-rounded-none: 0px;\n    --nc-rounded-xs: 2px;\n    --nc-rounded-xs-plus: 4px;\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: 24px;\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: 21px;\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: 80%;\n    --nc-material-dark-scrim-opacity: 60%;\n    --nc-material-glass-opacity: 55%;\n    --nc-material-glass-saturation: 180%;\n    --nc-material-glass-blur: 20px;\n    --nc-elevation-resting: 0px 0px 0px 1px rgb(0% 0% 0% / 0.08), 0px 2px 2px 0px rgb(0% 0% 0% / 0.04);\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 16px -4px rgb(0% 0% 0% / 0.08);\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.06),\n      0px 16px 32px -8px rgb(0% 0% 0% / 0.1);\n    --nc-elevation-modal:\n      0px 0px 0px 1px rgb(0% 0% 0% / 0.08),\n      0px 8px 24px -12px rgb(0% 0% 0% / 0.12),\n      0px 32px 72px -12px rgb(0% 0% 0% / 0.12);\n    --nc-elevation-glass:\n      inset 0px 1px 0px 0px rgb(100% 100% 100% / 0.75),\n      inset 0px 0px 0px 1px rgb(100% 100% 100% / 0.35),\n      0px 0px 0px 1px rgb(0% 0% 0% / 0.08),\n      0px 4px 8px -4px rgb(0% 0% 0% / 0.06),\n      0px 16px 32px -8px rgb(0% 0% 0% / 0.08);\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-material-scrim-opacity: var(--nc-material-dark-scrim-opacity);\n    --nc-elevation-resting:\n      0px 0px 0px 1px rgb(100% 100% 100% / 0.145),\n      0px 0px 0px 2px rgb(0% 0% 0%),\n      0px 1px 2px 0px rgb(0% 0% 0% / 0.5);\n    --nc-elevation-raised:\n      inset 0px 1px 0px 0px rgb(100% 100% 100% / 0.06),\n      0px 0px 0px 1px rgb(100% 100% 100% / 0.16),\n      0px 0px 0px 2px rgb(0% 0% 0%),\n      0px 12px 24px -8px rgb(0% 0% 0% / 0.8);\n    --nc-elevation-floating:\n      inset 0px 1px 0px 0px rgb(100% 100% 100% / 0.08),\n      0px 0px 0px 1px rgb(100% 100% 100% / 0.16),\n      0px 0px 0px 2px rgb(0% 0% 0%),\n      0px 24px 48px -12px rgb(0% 0% 0% / 0.9);\n    --nc-elevation-modal:\n      inset 0px 1px 0px 0px rgb(100% 100% 100% / 0.1),\n      0px 0px 0px 1px rgb(100% 100% 100% / 0.18),\n      0px 0px 0px 2px rgb(0% 0% 0%),\n      0px 48px 96px -24px rgb(0% 0% 0%);\n    --nc-elevation-glass:\n      inset 0px 1px 0px 0px rgb(100% 100% 100% / 0.1),\n      0px 0px 0px 1px rgb(100% 100% 100% / 0.14),\n      0px 16px 32px -12px rgb(0% 0% 0% / 0.8);\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.137",
+  "version": "12.1.139",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -83,7 +83,7 @@
     "@base-ui/react": "^1.9.0",
     "@iconify-icons/logos": "^2.0.3",
     "@iconify/react": "^6.0.2",
-    "@nadicodeai/design-system": "12.1.137",
+    "@nadicodeai/design-system": "12.1.139",
     "@tanstack/react-table": "^9.3.1",
     "@vgpu/wgsl": "0.6.0",
     "class-variance-authority": "^0.7.1",