@nadicodeai/design-system 0.17.0 → 0.18.0

package/CONTEXT.md

@@ -37,6 +37,9 @@ The perceptual brightness difference that makes the edge between adjacent campi,
 **Page grammar**:
 The shared structural system of frames, rows, lanes, fills, seams, markers, grids, and stages used to compose NadicodeAI pages.
 
+**Seam**:
+A visible structural line in the page grammar: the shared edge where a frame, row, lane, or grid cell meets its neighbour. Exactly one element owns and draws each seam, so no coordinate is ever drawn twice, and seam placement is computed from grid math rather than eyeballed; the rule and the tokens that colour it live in `design-system/DESIGN.md` "Seam Ownership" and "Layout". This is the visual sense of the word only. Its architectural sense, a boundary in code a test can substitute, is general software vocabulary and not part of the design language.
+
 **CSS primitive**:
 A low-level, framework-agnostic CSS helper for geometry, type, seams, fills, or structural behavior. It carries no product-specific meaning.
 

package/DESIGN.md

@@ -62,9 +62,9 @@ colors:
   campo-bianco: "#ffffff"
   chart-1: "#1e3cff"
   chart-2: "#00a85a"
-  chart-3: "#ffc220"
+  chart-3: "#ddaa00"
   chart-4: "#d3302f"
-  chart-5: "#00838f"
+  chart-5: "#0096a7"
   chart-6: "#6f42c1"
   chart-seq-1: "#7d99f2"
   chart-seq-2: "#4f6ae6"
@@ -356,7 +356,7 @@ Every value a role needs is carried by the role token itself; there are no ten-s
 
 ### Chart categoricals (functional tier)
 
-- **Charts** (`{colors.chart-1}`…`{colors.chart-6}`): the categorical series palette — cobalto, verde, giallo, rosso, plus a functional-only teal and viola. Functional only: never place chart colours on marketing surfaces, campi, or generated imagery. On the dark canvas all six series carry dark-tuned steps (`{colors.dark-chart-1}`…`{colors.dark-chart-6}`), remapped in the `.dark` scope so any consumer reading the semantic token gets the right hue in both modes. Clearing the 3:1 WCAG 1.4.11 data-mark floor is necessary but not sufficient on the near-black canvas: the full-strength light hues read as loud blocks there, so each dark step lightens or desaturates while keeping series identity, and all six clear 3:1 against `{colors.dark-canvas}`.
+- **Charts** (`{colors.chart-1}`…`{colors.chart-6}`): the categorical series palette — cobalto, verde, giallo, rosso, plus a functional-only teal and viola. Functional only: never place chart colours on marketing surfaces, campi, or generated imagery. Two light slots are series-tuned so the set clears the categorical data bands on the white data surface: `chart-3` steps the giallo darker (the campo giallo `{colors.campo-giallo}` overshoots the categorical lightness band and reads too pale as a mark) and `chart-5` makes the teal more chromatic (the raw functional teal otherwise sits under the chroma floor and reads gray). The darker giallo still falls below the 3:1 mark-contrast line and is carried by the always-on legend/direct-label/table relief the charting method already mandates — never a per-surface patch. On the dark canvas all six series carry dark-tuned steps (`{colors.dark-chart-1}`…`{colors.dark-chart-6}`), remapped in the `.dark` scope so any consumer reading the semantic token gets the right hue in both modes. Clearing the 3:1 WCAG 1.4.11 data-mark floor is necessary but not sufficient on the near-black canvas: full-strength hues read as loud blocks there, so each dark step lightens or desaturates while keeping series identity — the dark giallo and teal deliberately stay bright to hold their per-series deuteranopia separation from rosso — and all six clear 3:1 against `{colors.dark-canvas}`.
 - **Categorical distinguishability**: the same-family neighbours are held apart — `chart-3`/`chart-4` (giallo/rosso) and `chart-2`/`chart-5` (verde/teal) each clear a CIEDE2000 ≥ 20 normal / ≥ 15 deuteranopia-simulated floor, in the light set and the dark-tuned set alike. Two proximities are brand-locked and exempt from the numeric floor: `chart-2`/`chart-4` (verde/rosso, the flag pair, which collapses under red-green deficiency by identity) and `chart-1`/`chart-6` (cobalto/viola, adjacent blue-violet). Charts using the full six carry redundant encoding (direct labels, position, or pattern), never hue alone, so these two pairs stay readable under colour-vision deficiency.
 
 ### Brand tier — i campi
@@ -743,6 +743,8 @@ The NadicodeAI logo has three approved forms:
 
 Nadia's portrait and generated imagery belong to the agent's visual identity. Neither is a NadicodeAI company logo.
 
+The four canonical Nadia material states ship as transparent PNG assets in their fixed semantic order: `assets/nadia-solid-surface`, `assets/nadia-ordered-points`, `assets/nadia-triangulated-wire`, and `assets/nadia-irregular-particles`. They are background-neutral compositing assets derived from the one approved identity and may sit on any field that keeps the selected state legible. The older editorial face and full-body references remain in the brand imagery library for generation guidance; they are not public product-portrait exports.
+
 All three forms derive from one authored, framework-neutral geometry source exported as `@nadicodeai/design-system/assets/logo-geometry`. The lockup combines the shared mark and wordmark geometry at the established proportion and spacing. No SVG, React component, favicon, document, or app re-authors, traces, typesets, or rearranges those shapes.
 
 Use the positive form on `{colors.canvas}` and the soft neutral canvases: ink letterforms and link with the primary verde link and `AI` suffix. Use the inverse form on `{colors.campo-inchiostro}`: campo-bianco letterforms and link with the dark-primary verde link and `AI` suffix. On `{colors.campo-verde}`, use the supplied on-verde form with one ink link and one white link. On photography, place the logo in a quiet area or over a scrim that keeps every part legible; when neither is available, mount it on an approved solid field. One surface uses one treatment.

package/README.md

@@ -51,6 +51,19 @@ For direct HTML or CDN delivery, use a version-pinned file URL such as
 The clear-space, minimum-size, accessibility, background, and prohibited-use rules live only in
 [`DESIGN.md`, "Brand media authority"](./DESIGN.md#brand-media-authority).
 
+### Nadia material states
+
+The package ships Nadia's four background-neutral transparent portraits in their fixed order:
+
+| State | Import |
+| --- | --- |
+| Solid surface | `@nadicodeai/design-system/assets/nadia-solid-surface` |
+| Ordered points | `@nadicodeai/design-system/assets/nadia-ordered-points` |
+| Triangulated wire | `@nadicodeai/design-system/assets/nadia-triangulated-wire` |
+| Irregular particles | `@nadicodeai/design-system/assets/nadia-irregular-particles` |
+
+Each import resolves to the canonical transparent PNG. Select the state for its product meaning; do not treat the four portraits as interchangeable decoration.
+
 ## Package surface
 
 `package.json` owns the current public export paths. [`DESIGN.md`](./DESIGN.md)

package/dist/css/index.css

@@ -57,9 +57,9 @@
     --nc-campo-bianco: oklch(1.0000 0.0000 0.00);
     --nc-chart-1: oklch(0.5005 0.2804 266.17);
     --nc-chart-2: oklch(0.6415 0.1644 153.23);
-    --nc-chart-3: oklch(0.8466 0.1678 84.63);
+    --nc-chart-3: oklch(0.7638 0.1562 86.86);
     --nc-chart-4: oklch(0.5688 0.1995 26.59);
-    --nc-chart-5: oklch(0.5571 0.0953 206.08);
+    --nc-chart-5: oklch(0.6161 0.1062 208.85);
     --nc-chart-6: oklch(0.5015 0.1883 294.99);
     --nc-chart-seq-1: oklch(0.6998 0.1347 269.48);
     --nc-chart-seq-2: oklch(0.5724 0.1897 270.11);
@@ -551,7 +551,7 @@
     --sidebar-ring: var(--nc-dark-focus-ring);
   }
   @theme inline { --color-background: var(--background); --color-foreground: var(--foreground); --color-card: var(--card); --color-card-foreground: var(--card-foreground); --color-popover: var(--popover); --color-popover-foreground: var(--popover-foreground); --color-primary: var(--primary); --color-primary-foreground: var(--primary-foreground); --color-primary-hover: var(--primary-hover); --color-primary-active: var(--primary-active); --color-secondary: var(--secondary); --color-secondary-foreground: var(--secondary-foreground); --color-muted: var(--muted); --color-muted-foreground: var(--muted-foreground); --color-placeholder: var(--placeholder); --color-accent: var(--accent); --color-accent-foreground: var(--accent-foreground); --color-destructive: var(--destructive); --color-destructive-foreground: var(--destructive-foreground); --color-warning: var(--warning); --color-warning-foreground: var(--warning-foreground); --color-success: var(--success); --color-success-foreground: var(--success-foreground); --color-border: var(--border); --color-input: var(--input); --color-ring: var(--ring); --color-scrim: var(--scrim); --color-chart-1: var(--chart-1); --color-chart-2: var(--chart-2); --color-chart-3: var(--chart-3); --color-chart-4: var(--chart-4); --color-chart-5: var(--chart-5); --color-sidebar: var(--sidebar); --color-sidebar-foreground: var(--sidebar-foreground); --color-sidebar-primary: var(--sidebar-primary); --color-sidebar-primary-foreground: var(--sidebar-primary-foreground); --color-sidebar-primary-hover: var(--sidebar-primary-hover); --color-sidebar-accent: var(--sidebar-accent); --color-sidebar-accent-foreground: var(--sidebar-accent-foreground); --color-sidebar-border: var(--sidebar-border); --color-sidebar-ring: var(--sidebar-ring); }
-  @theme { --color-nc-primary: oklch(0.5075 0.1338 151.91); --color-nc-on-primary: oklch(1.0000 0.0000 0.00); --color-nc-action: oklch(0.5075 0.1338 151.91); --color-nc-action-foreground: oklch(1.0000 0.0000 0.00); --color-nc-action-hover: oklch(0.4285 0.1117 152.40); --color-nc-action-active: oklch(0.2722 0.0643 157.47); --color-nc-ink: oklch(0.1776 0.0000 0.00); --color-nc-body: oklch(0.3867 0.0000 0.00); --color-nc-muted: oklch(0.5278 0.0000 0.00); --color-nc-canvas: oklch(1.0000 0.0000 0.00); --color-nc-canvas-soft: oklch(0.9851 0.0000 0.00); --color-nc-canvas-soft-2: oklch(0.9702 0.0000 0.00); --color-nc-line: oklch(0.9219 0.0000 0.00); --color-nc-input: oklch(0.5624 0.0000 0.00); --color-nc-seam: oklch(0.8699 0.0000 0.00); --color-nc-cross: oklch(0.6830 0.0000 0.00); --color-nc-focus-ring: oklch(0.4815 0.1209 154.24); --color-nc-scrim: oklch(0.1776 0.0000 0.00); --color-nc-link: oklch(0.4815 0.1209 154.24); --color-nc-link-deep: oklch(0.3852 0.0953 154.99); --color-nc-link-bg-soft: oklch(0.9170 0.0519 161.77); --color-nc-accent: oklch(0.6824 0.2108 37.70); --color-nc-info: oklch(0.5005 0.2804 266.17); --color-nc-info-soft: oklch(0.9457 0.0259 276.40); --color-nc-info-deep: oklch(0.3197 0.1758 266.79); --color-nc-success: oklch(0.6415 0.1644 153.23); --color-nc-error: oklch(0.5688 0.1995 26.59); --color-nc-error-soft: oklch(0.9522 0.0207 17.52); --color-nc-error-deep: oklch(0.4235 0.1525 27.08); --color-nc-warning: oklch(0.8466 0.1678 84.63); --color-nc-warning-soft: oklch(0.9649 0.0461 90.87); --color-nc-warning-deep: oklch(0.4834 0.0995 82.44); --color-nc-flag-red: oklch(0.5688 0.1995 26.59); --color-nc-selection-bg: oklch(0.1776 0.0000 0.00); --color-nc-selection-fg: oklch(0.9851 0.0000 0.00); --color-nc-navigation-selection-bg: oklch(0.5005 0.2804 266.17); --color-nc-navigation-selection-fg: oklch(1.0000 0.0000 0.00); --color-nc-navigation-selection-hover: oklch(0.4542 0.2521 265.86); --color-nc-state-ready: oklch(0.5278 0.0000 0.00); --color-nc-state-running: oklch(0.5005 0.2804 266.17); --color-nc-state-review: oklch(0.8466 0.1678 84.63); --color-nc-state-blocked: oklch(0.5688 0.1995 26.59); --color-nc-state-complete: oklch(0.6415 0.1644 153.23); --color-nc-background-100: oklch(1.0000 0.0000 0.00); --color-nc-background-200: oklch(0.9851 0.0000 0.00); --color-nc-campo-verde: oklch(0.6415 0.1644 153.23); --color-nc-campo-rosso: oklch(0.5688 0.1995 26.59); --color-nc-campo-arancio: oklch(0.6824 0.2108 37.70); --color-nc-campo-giallo: oklch(0.8466 0.1678 84.63); --color-nc-campo-cobalto: oklch(0.5005 0.2804 266.17); --color-nc-campo-inchiostro: oklch(0.1776 0.0000 0.00); --color-nc-campo-bianco: oklch(1.0000 0.0000 0.00); --color-nc-chart-1: oklch(0.5005 0.2804 266.17); --color-nc-chart-2: oklch(0.6415 0.1644 153.23); --color-nc-chart-3: oklch(0.8466 0.1678 84.63); --color-nc-chart-4: oklch(0.5688 0.1995 26.59); --color-nc-chart-5: oklch(0.5571 0.0953 206.08); --color-nc-chart-6: oklch(0.5015 0.1883 294.99); --color-nc-chart-seq-1: oklch(0.6998 0.1347 269.48); --color-nc-chart-seq-2: oklch(0.5724 0.1897 270.11); --color-nc-chart-seq-3: oklch(0.4725 0.2271 267.41); --color-nc-chart-seq-4: oklch(0.3989 0.1934 267.50); --color-nc-chart-seq-5: oklch(0.3270 0.1487 267.91); --color-nc-chart-div-warm: oklch(0.7592 0.1560 83.30); --color-nc-chart-div-mid: oklch(0.5278 0.0000 0.00); --color-nc-chart-div-cool: oklch(0.5923 0.2215 269.61); --color-nc-dark-canvas: oklch(0.1448 0.0000 0.00); --color-nc-dark-canvas-soft: oklch(0.1776 0.0000 0.00); --color-nc-dark-canvas-soft-2: oklch(0.2178 0.0000 0.00); --color-nc-dark-ink: oklch(0.9461 0.0000 0.00); --color-nc-dark-body: oklch(0.8297 0.0000 0.00); --color-nc-dark-muted: oklch(0.6500 0.0000 0.00); --color-nc-dark-line: oklch(0.2686 0.0000 0.00); --color-nc-dark-input: oklch(0.5208 0.0000 0.00); --color-nc-dark-seam: oklch(0.2178 0.0000 0.00); --color-nc-dark-primary: oklch(0.7727 0.1753 155.96); --color-nc-dark-on-primary: oklch(0.1448 0.0000 0.00); --color-nc-dark-action: oklch(0.7727 0.1753 155.96); --color-nc-dark-action-foreground: oklch(0.1448 0.0000 0.00); --color-nc-dark-action-hover: oklch(0.7661 0.1498 157.10); --color-nc-dark-action-active: oklch(0.7019 0.1753 153.20); --color-nc-dark-link: oklch(0.7661 0.1498 157.10); --color-nc-dark-link-deep: oklch(0.8524 0.0996 159.83); --color-nc-dark-link-bg-soft: oklch(0.2893 0.0697 156.32); --color-nc-dark-focus-ring: oklch(0.7661 0.1498 157.10); --color-nc-dark-scrim: oklch(0.9461 0.0000 0.00); --color-nc-dark-error: oklch(0.7955 0.0980 21.02); --color-nc-dark-error-soft: oklch(0.2296 0.0728 26.06); --color-nc-dark-error-deep: oklch(0.8856 0.0534 19.64); --color-nc-dark-warning: oklch(0.8939 0.1387 90.47); --color-nc-dark-warning-soft: oklch(0.3135 0.0643 85.04); --color-nc-dark-warning-deep: oklch(0.9320 0.0896 90.86); --color-nc-dark-info: oklch(0.7067 0.1528 272.08); --color-nc-dark-info-soft: oklch(0.2118 0.1033 268.28); --color-nc-dark-info-deep: oklch(0.8222 0.0888 274.44); --color-nc-dark-cyan: oklch(0.7820 0.1247 190.99); --color-nc-dark-cyan-soft: oklch(0.8646 0.1000 187.55); --color-nc-dark-cyan-deep: oklch(0.6347 0.1029 191.54); --color-nc-dark-success: oklch(0.7019 0.1753 153.20); --color-nc-dark-state-ready: oklch(0.5624 0.0000 0.00); --color-nc-dark-state-running: oklch(0.5923 0.2215 269.61); --color-nc-dark-state-review: oklch(0.8466 0.1678 84.63); --color-nc-dark-state-blocked: oklch(0.5688 0.1995 26.59); --color-nc-dark-state-complete: oklch(0.6415 0.1644 153.23); --color-nc-dark-selection-bg: oklch(0.9461 0.0000 0.00); --color-nc-dark-selection-fg: oklch(0.1448 0.0000 0.00); --color-nc-dark-navigation-selection-bg: oklch(0.4725 0.2271 267.41); --color-nc-dark-navigation-selection-fg: oklch(0.9461 0.0000 0.00); --color-nc-dark-navigation-selection-hover: oklch(0.5162 0.2247 268.31); --color-nc-dark-cross: oklch(0.4495 0.0000 0.00); --color-nc-dark-chart-1: oklch(0.5923 0.2215 269.61); --color-nc-dark-chart-2: oklch(0.6415 0.1644 153.23); --color-nc-dark-chart-3: oklch(0.8939 0.1387 90.47); --color-nc-dark-chart-4: oklch(0.6627 0.1685 23.66); --color-nc-dark-chart-5: oklch(0.7820 0.1247 190.99); --color-nc-dark-chart-6: oklch(0.6297 0.1321 299.36); --color-nc-dark-chart-seq-1: oklch(0.5724 0.1897 270.11); --color-nc-dark-chart-seq-2: oklch(0.6998 0.1347 269.48); --color-nc-dark-chart-seq-3: oklch(0.8072 0.0884 269.44); --color-nc-dark-chart-seq-4: oklch(0.8877 0.0514 270.78); --color-nc-dark-chart-seq-5: oklch(0.9619 0.0179 272.31); --color-nc-dark-chart-div-warm: oklch(0.8939 0.1387 90.47); --color-nc-dark-chart-div-mid: oklch(0.9219 0.0000 0.00); --color-nc-dark-chart-div-cool: oklch(0.8222 0.0888 274.44); --font-display-xl: Geist, Inter, system-ui, -apple-system, sans-serif; --font-display-lg: Geist, Inter, system-ui, -apple-system, sans-serif; --font-display-md: Geist, Inter, system-ui, -apple-system, sans-serif; --font-display-sm: Geist, Inter, system-ui, -apple-system, sans-serif; --font-title-lg: Geist, Inter, system-ui, -apple-system, sans-serif; --font-title-md: Geist, Inter, system-ui, -apple-system, sans-serif; --font-title-sm: Geist, Inter, system-ui, -apple-system, sans-serif; --font-body-lg: Geist, Inter, system-ui, -apple-system, sans-serif; --font-body-md: Geist, Inter, system-ui, -apple-system, sans-serif; --font-body-md-strong: Geist, Inter, system-ui, -apple-system, sans-serif; --font-body-sm: Geist, Inter, system-ui, -apple-system, sans-serif; --font-body-sm-strong: Geist, Inter, system-ui, -apple-system, sans-serif; --font-caption: Geist, Inter, system-ui, -apple-system, sans-serif; --font-caption-strong: Geist, Inter, system-ui, -apple-system, sans-serif; --font-caption-mono: Geist Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, monospace; --font-code: Geist Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, monospace; --font-button-md: Geist, Inter, system-ui, -apple-system, sans-serif; --font-button-lg: Geist, Inter, system-ui, -apple-system, sans-serif; --text-display-xl: 72px; --text-display-xl--line-height: 74px; --leading-display-xl: 74px; --text-display-xl--letter-spacing: -1.5px; --tracking-display-xl: -1.5px; --text-display-xl--font-weight: 600; --font-weight-display-xl: 600; --text-display-lg: 52px; --text-display-lg--line-height: 54px; --leading-display-lg: 54px; --text-display-lg--letter-spacing: -1px; --tracking-display-lg: -1px; --text-display-lg--font-weight: 600; --font-weight-display-lg: 600; --text-display-md: 24px; --text-display-md--line-height: 32px; --leading-display-md: 32px; --text-display-md--letter-spacing: 0px; --tracking-display-md: 0px; --text-display-md--font-weight: 600; --font-weight-display-md: 600; --text-display-sm: 20px; --text-display-sm--line-height: 28px; --leading-display-sm: 28px; --text-display-sm--letter-spacing: 0px; --tracking-display-sm: 0px; --text-display-sm--font-weight: 600; --font-weight-display-sm: 600; --text-title-lg: 40px; --text-title-lg--line-height: 41px; --leading-title-lg: 41px; --text-title-lg--letter-spacing: 0px; --tracking-title-lg: 0px; --text-title-lg--font-weight: 600; --font-weight-title-lg: 600; --text-title-md: 30px; --text-title-md--line-height: 32px; --leading-title-md: 32px; --text-title-md--letter-spacing: 0px; --tracking-title-md: 0px; --text-title-md--font-weight: 600; --font-weight-title-md: 600; --text-title-sm: 22px; --text-title-sm--line-height: 25px; --leading-title-sm: 25px; --text-title-sm--letter-spacing: 0px; --tracking-title-sm: 0px; --text-title-sm--font-weight: 600; --font-weight-title-sm: 600; --text-body-lg: 18px; --text-body-lg--line-height: 27px; --leading-body-lg: 27px; --text-body-lg--letter-spacing: 0px; --tracking-body-lg: 0px; --text-body-lg--font-weight: 400; --font-weight-body-lg: 400; --text-body-md: 16px; --text-body-md--line-height: 25px; --leading-body-md: 25px; --text-body-md--letter-spacing: 0px; --tracking-body-md: 0px; --text-body-md--font-weight: 400; --font-weight-body-md: 400; --text-body-md-strong: 16px; --text-body-md-strong--line-height: 24px; --leading-body-md-strong: 24px; --text-body-md-strong--letter-spacing: 0px; --tracking-body-md-strong: 0px; --text-body-md-strong--font-weight: 500; --font-weight-body-md-strong: 500; --text-body-sm: 14px; --text-body-sm--line-height: 20px; --leading-body-sm: 20px; --text-body-sm--letter-spacing: 0px; --tracking-body-sm: 0px; --text-body-sm--font-weight: 400; --font-weight-body-sm: 400; --text-body-sm-strong: 14px; --text-body-sm-strong--line-height: 20px; --leading-body-sm-strong: 20px; --text-body-sm-strong--letter-spacing: 0px; --tracking-body-sm-strong: 0px; --text-body-sm-strong--font-weight: 500; --font-weight-body-sm-strong: 500; --text-caption: 12px; --text-caption--line-height: 16px; --leading-caption: 16px; --text-caption--letter-spacing: 0px; --tracking-caption: 0px; --text-caption--font-weight: 400; --font-weight-caption: 400; --text-caption-strong: 12px; --text-caption-strong--line-height: 16px; --leading-caption-strong: 16px; --text-caption-strong--letter-spacing: 0px; --tracking-caption-strong: 0px; --text-caption-strong--font-weight: 500; --font-weight-caption-strong: 500; --text-caption-mono: 12px; --text-caption-mono--line-height: 16px; --leading-caption-mono: 16px; --text-caption-mono--letter-spacing: 0px; --tracking-caption-mono: 0px; --text-caption-mono--font-weight: 500; --font-weight-caption-mono: 500; --text-code: 13px; --text-code--line-height: 20px; --leading-code: 20px; --text-code--letter-spacing: 0px; --tracking-code: 0px; --text-code--font-weight: 400; --font-weight-code: 400; --text-button-md: 14px; --text-button-md--line-height: 18px; --leading-button-md: 18px; --text-button-md--letter-spacing: 0px; --tracking-button-md: 0px; --text-button-md--font-weight: 500; --font-weight-button-md: 500; --text-button-lg: 16px; --text-button-lg--line-height: 24px; --leading-button-lg: 24px; --text-button-lg--letter-spacing: 0px; --tracking-button-lg: 0px; --text-button-lg--font-weight: 500; --font-weight-button-lg: 500; --radius-none: 0px; --radius-xs: 2px; --radius-sm: 4px; --radius-md: 6px; --radius-lg: 8px; --radius-xl: 10px; --radius-2xl: 12px; --radius-3xl: 16px; --radius-pill-sm: 64px; --radius-pill: 100px; --radius-full: 9999px; --ring-width-focus: var(--spacing-nadicode-focus-ring-width); --opacity-scrim: var(--nc-material-scrim-opacity); --shadow-tooltip: var(--nc-material-shadow-tooltip); --shadow-menu: var(--nc-material-shadow-menu); --shadow-dialog: var(--nc-material-shadow-dialog); --shadow-sheet: var(--nc-material-shadow-sheet); --spacing-nadicode-xxs: 4px; --spacing-nadicode-filter-chip-gap: 6px; --spacing-nadicode-xs: 8px; --spacing-nadicode-sm: 12px; --spacing-nadicode-md: 16px; --spacing-nadicode-lg: 24px; --spacing-nadicode-xl: 32px; --spacing-nadicode-2xl: 40px; --spacing-nadicode-3xl: 48px; --spacing-nadicode-4xl: 64px; --spacing-nadicode-5xl: 96px; --spacing-nadicode-6xl: 128px; --spacing-nadicode-section: 192px; --spacing-nadicode-guide: 1px; --spacing-nadicode-icon-stroke: 1.6px; --spacing-nadicode-focus-ring-width: 3px; --spacing-nadicode-control-height: 32px; --spacing-nadicode-control-padding-inline: 10px; --spacing-nadicode-touch-target: 44px; --spacing-nadicode-page-pad: 24px; --spacing-nadicode-page-max-mobile: 448px; --spacing-nadicode-page-max-tablet: 624px; --spacing-nadicode-page-max-desktop: 1440px; --spacing-nadicode-frame-max: 1392px; --spacing-nadicode-frame-gap: 24px; --spacing-nadicode-cell-padding: 24px; --spacing-nadicode-section-gap: 48px; --spacing-nadicode-cross-size-mobile: 11px; --spacing-nadicode-cross-size-tablet: 15px; --spacing-nadicode-cross-size-desktop: 21px; --spacing-nadicode-h-strip-mobile: 72px; --spacing-nadicode-h-strip-tablet: 80px; --spacing-nadicode-h-strip-desktop: 88px; --spacing-nadicode-h-cell-sm: 120px; --spacing-nadicode-h-cell-md-mobile: 144px; --spacing-nadicode-h-cell-md-tablet: 160px; --spacing-nadicode-h-cell-md-desktop: 168px; --spacing-nadicode-h-cell-lg-mobile: 220px; --spacing-nadicode-h-cell-lg-desktop: 240px; --spacing-nadicode-h-visual-mobile: 276px; --spacing-nadicode-h-visual-tablet: 318px; --spacing-nadicode-h-visual-desktop: 360px; --spacing-nadicode-h-precision-mobile: 276px; --spacing-nadicode-h-precision-tablet: 480px; --spacing-nadicode-h-precision-desktop: 720px; --spacing-nadicode-h-hero-mobile: 560px; --spacing-nadicode-h-hero-desktop: 720px; --spacing-nadicode-h-action-strip-mobile: 20px; --spacing-nadicode-h-action-strip-desktop: 32px; --spacing-nadicode-h-action-body-mobile: 320px; --spacing-nadicode-h-action-body-tablet: 338px; --spacing-nadicode-h-action-band: 260px; --spacing-nadicode-h-feature-mobile: 360px; --spacing-nadicode-h-feature-tablet: 400px; --spacing-nadicode-h-feature-desktop: 456px; --spacing-nadicode-h-editorial-feature-mobile: 360px; --spacing-nadicode-h-editorial-feature-tablet: 440px; --spacing-nadicode-h-editorial-feature-desktop: 560px; --spacing-nadicode-h-bento-primary: 384px; --spacing-nadicode-h-bento-secondary: 240px; --spacing-nadicode-h-bento-mobile-copy: 248px; --spacing-nadicode-h-bento-mobile-main: 537px; --spacing-nadicode-h-bento-strip: 20px; --spacing-nadicode-filter-chip-height: 28px; --spacing-nadicode-filter-chip-icon: 14px; --spacing-control-height: var(--spacing-nadicode-control-height); --spacing-control-padding-inline: var(--spacing-nadicode-control-padding-inline); --spacing-touch-target: var(--spacing-nadicode-touch-target); }
+  @theme { --color-nc-primary: oklch(0.5075 0.1338 151.91); --color-nc-on-primary: oklch(1.0000 0.0000 0.00); --color-nc-action: oklch(0.5075 0.1338 151.91); --color-nc-action-foreground: oklch(1.0000 0.0000 0.00); --color-nc-action-hover: oklch(0.4285 0.1117 152.40); --color-nc-action-active: oklch(0.2722 0.0643 157.47); --color-nc-ink: oklch(0.1776 0.0000 0.00); --color-nc-body: oklch(0.3867 0.0000 0.00); --color-nc-muted: oklch(0.5278 0.0000 0.00); --color-nc-canvas: oklch(1.0000 0.0000 0.00); --color-nc-canvas-soft: oklch(0.9851 0.0000 0.00); --color-nc-canvas-soft-2: oklch(0.9702 0.0000 0.00); --color-nc-line: oklch(0.9219 0.0000 0.00); --color-nc-input: oklch(0.5624 0.0000 0.00); --color-nc-seam: oklch(0.8699 0.0000 0.00); --color-nc-cross: oklch(0.6830 0.0000 0.00); --color-nc-focus-ring: oklch(0.4815 0.1209 154.24); --color-nc-scrim: oklch(0.1776 0.0000 0.00); --color-nc-link: oklch(0.4815 0.1209 154.24); --color-nc-link-deep: oklch(0.3852 0.0953 154.99); --color-nc-link-bg-soft: oklch(0.9170 0.0519 161.77); --color-nc-accent: oklch(0.6824 0.2108 37.70); --color-nc-info: oklch(0.5005 0.2804 266.17); --color-nc-info-soft: oklch(0.9457 0.0259 276.40); --color-nc-info-deep: oklch(0.3197 0.1758 266.79); --color-nc-success: oklch(0.6415 0.1644 153.23); --color-nc-error: oklch(0.5688 0.1995 26.59); --color-nc-error-soft: oklch(0.9522 0.0207 17.52); --color-nc-error-deep: oklch(0.4235 0.1525 27.08); --color-nc-warning: oklch(0.8466 0.1678 84.63); --color-nc-warning-soft: oklch(0.9649 0.0461 90.87); --color-nc-warning-deep: oklch(0.4834 0.0995 82.44); --color-nc-flag-red: oklch(0.5688 0.1995 26.59); --color-nc-selection-bg: oklch(0.1776 0.0000 0.00); --color-nc-selection-fg: oklch(0.9851 0.0000 0.00); --color-nc-navigation-selection-bg: oklch(0.5005 0.2804 266.17); --color-nc-navigation-selection-fg: oklch(1.0000 0.0000 0.00); --color-nc-navigation-selection-hover: oklch(0.4542 0.2521 265.86); --color-nc-state-ready: oklch(0.5278 0.0000 0.00); --color-nc-state-running: oklch(0.5005 0.2804 266.17); --color-nc-state-review: oklch(0.8466 0.1678 84.63); --color-nc-state-blocked: oklch(0.5688 0.1995 26.59); --color-nc-state-complete: oklch(0.6415 0.1644 153.23); --color-nc-background-100: oklch(1.0000 0.0000 0.00); --color-nc-background-200: oklch(0.9851 0.0000 0.00); --color-nc-campo-verde: oklch(0.6415 0.1644 153.23); --color-nc-campo-rosso: oklch(0.5688 0.1995 26.59); --color-nc-campo-arancio: oklch(0.6824 0.2108 37.70); --color-nc-campo-giallo: oklch(0.8466 0.1678 84.63); --color-nc-campo-cobalto: oklch(0.5005 0.2804 266.17); --color-nc-campo-inchiostro: oklch(0.1776 0.0000 0.00); --color-nc-campo-bianco: oklch(1.0000 0.0000 0.00); --color-nc-chart-1: oklch(0.5005 0.2804 266.17); --color-nc-chart-2: oklch(0.6415 0.1644 153.23); --color-nc-chart-3: oklch(0.7638 0.1562 86.86); --color-nc-chart-4: oklch(0.5688 0.1995 26.59); --color-nc-chart-5: oklch(0.6161 0.1062 208.85); --color-nc-chart-6: oklch(0.5015 0.1883 294.99); --color-nc-chart-seq-1: oklch(0.6998 0.1347 269.48); --color-nc-chart-seq-2: oklch(0.5724 0.1897 270.11); --color-nc-chart-seq-3: oklch(0.4725 0.2271 267.41); --color-nc-chart-seq-4: oklch(0.3989 0.1934 267.50); --color-nc-chart-seq-5: oklch(0.3270 0.1487 267.91); --color-nc-chart-div-warm: oklch(0.7592 0.1560 83.30); --color-nc-chart-div-mid: oklch(0.5278 0.0000 0.00); --color-nc-chart-div-cool: oklch(0.5923 0.2215 269.61); --color-nc-dark-canvas: oklch(0.1448 0.0000 0.00); --color-nc-dark-canvas-soft: oklch(0.1776 0.0000 0.00); --color-nc-dark-canvas-soft-2: oklch(0.2178 0.0000 0.00); --color-nc-dark-ink: oklch(0.9461 0.0000 0.00); --color-nc-dark-body: oklch(0.8297 0.0000 0.00); --color-nc-dark-muted: oklch(0.6500 0.0000 0.00); --color-nc-dark-line: oklch(0.2686 0.0000 0.00); --color-nc-dark-input: oklch(0.5208 0.0000 0.00); --color-nc-dark-seam: oklch(0.2178 0.0000 0.00); --color-nc-dark-primary: oklch(0.7727 0.1753 155.96); --color-nc-dark-on-primary: oklch(0.1448 0.0000 0.00); --color-nc-dark-action: oklch(0.7727 0.1753 155.96); --color-nc-dark-action-foreground: oklch(0.1448 0.0000 0.00); --color-nc-dark-action-hover: oklch(0.7661 0.1498 157.10); --color-nc-dark-action-active: oklch(0.7019 0.1753 153.20); --color-nc-dark-link: oklch(0.7661 0.1498 157.10); --color-nc-dark-link-deep: oklch(0.8524 0.0996 159.83); --color-nc-dark-link-bg-soft: oklch(0.2893 0.0697 156.32); --color-nc-dark-focus-ring: oklch(0.7661 0.1498 157.10); --color-nc-dark-scrim: oklch(0.9461 0.0000 0.00); --color-nc-dark-error: oklch(0.7955 0.0980 21.02); --color-nc-dark-error-soft: oklch(0.2296 0.0728 26.06); --color-nc-dark-error-deep: oklch(0.8856 0.0534 19.64); --color-nc-dark-warning: oklch(0.8939 0.1387 90.47); --color-nc-dark-warning-soft: oklch(0.3135 0.0643 85.04); --color-nc-dark-warning-deep: oklch(0.9320 0.0896 90.86); --color-nc-dark-info: oklch(0.7067 0.1528 272.08); --color-nc-dark-info-soft: oklch(0.2118 0.1033 268.28); --color-nc-dark-info-deep: oklch(0.8222 0.0888 274.44); --color-nc-dark-cyan: oklch(0.7820 0.1247 190.99); --color-nc-dark-cyan-soft: oklch(0.8646 0.1000 187.55); --color-nc-dark-cyan-deep: oklch(0.6347 0.1029 191.54); --color-nc-dark-success: oklch(0.7019 0.1753 153.20); --color-nc-dark-state-ready: oklch(0.5624 0.0000 0.00); --color-nc-dark-state-running: oklch(0.5923 0.2215 269.61); --color-nc-dark-state-review: oklch(0.8466 0.1678 84.63); --color-nc-dark-state-blocked: oklch(0.5688 0.1995 26.59); --color-nc-dark-state-complete: oklch(0.6415 0.1644 153.23); --color-nc-dark-selection-bg: oklch(0.9461 0.0000 0.00); --color-nc-dark-selection-fg: oklch(0.1448 0.0000 0.00); --color-nc-dark-navigation-selection-bg: oklch(0.4725 0.2271 267.41); --color-nc-dark-navigation-selection-fg: oklch(0.9461 0.0000 0.00); --color-nc-dark-navigation-selection-hover: oklch(0.5162 0.2247 268.31); --color-nc-dark-cross: oklch(0.4495 0.0000 0.00); --color-nc-dark-chart-1: oklch(0.5923 0.2215 269.61); --color-nc-dark-chart-2: oklch(0.6415 0.1644 153.23); --color-nc-dark-chart-3: oklch(0.8939 0.1387 90.47); --color-nc-dark-chart-4: oklch(0.6627 0.1685 23.66); --color-nc-dark-chart-5: oklch(0.7820 0.1247 190.99); --color-nc-dark-chart-6: oklch(0.6297 0.1321 299.36); --color-nc-dark-chart-seq-1: oklch(0.5724 0.1897 270.11); --color-nc-dark-chart-seq-2: oklch(0.6998 0.1347 269.48); --color-nc-dark-chart-seq-3: oklch(0.8072 0.0884 269.44); --color-nc-dark-chart-seq-4: oklch(0.8877 0.0514 270.78); --color-nc-dark-chart-seq-5: oklch(0.9619 0.0179 272.31); --color-nc-dark-chart-div-warm: oklch(0.8939 0.1387 90.47); --color-nc-dark-chart-div-mid: oklch(0.9219 0.0000 0.00); --color-nc-dark-chart-div-cool: oklch(0.8222 0.0888 274.44); --font-display-xl: Geist, Inter, system-ui, -apple-system, sans-serif; --font-display-lg: Geist, Inter, system-ui, -apple-system, sans-serif; --font-display-md: Geist, Inter, system-ui, -apple-system, sans-serif; --font-display-sm: Geist, Inter, system-ui, -apple-system, sans-serif; --font-title-lg: Geist, Inter, system-ui, -apple-system, sans-serif; --font-title-md: Geist, Inter, system-ui, -apple-system, sans-serif; --font-title-sm: Geist, Inter, system-ui, -apple-system, sans-serif; --font-body-lg: Geist, Inter, system-ui, -apple-system, sans-serif; --font-body-md: Geist, Inter, system-ui, -apple-system, sans-serif; --font-body-md-strong: Geist, Inter, system-ui, -apple-system, sans-serif; --font-body-sm: Geist, Inter, system-ui, -apple-system, sans-serif; --font-body-sm-strong: Geist, Inter, system-ui, -apple-system, sans-serif; --font-caption: Geist, Inter, system-ui, -apple-system, sans-serif; --font-caption-strong: Geist, Inter, system-ui, -apple-system, sans-serif; --font-caption-mono: Geist Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, monospace; --font-code: Geist Mono, ui-monospace, SFMono-Regular, Menlo, Monaco, monospace; --font-button-md: Geist, Inter, system-ui, -apple-system, sans-serif; --font-button-lg: Geist, Inter, system-ui, -apple-system, sans-serif; --text-display-xl: 72px; --text-display-xl--line-height: 74px; --leading-display-xl: 74px; --text-display-xl--letter-spacing: -1.5px; --tracking-display-xl: -1.5px; --text-display-xl--font-weight: 600; --font-weight-display-xl: 600; --text-display-lg: 52px; --text-display-lg--line-height: 54px; --leading-display-lg: 54px; --text-display-lg--letter-spacing: -1px; --tracking-display-lg: -1px; --text-display-lg--font-weight: 600; --font-weight-display-lg: 600; --text-display-md: 24px; --text-display-md--line-height: 32px; --leading-display-md: 32px; --text-display-md--letter-spacing: 0px; --tracking-display-md: 0px; --text-display-md--font-weight: 600; --font-weight-display-md: 600; --text-display-sm: 20px; --text-display-sm--line-height: 28px; --leading-display-sm: 28px; --text-display-sm--letter-spacing: 0px; --tracking-display-sm: 0px; --text-display-sm--font-weight: 600; --font-weight-display-sm: 600; --text-title-lg: 40px; --text-title-lg--line-height: 41px; --leading-title-lg: 41px; --text-title-lg--letter-spacing: 0px; --tracking-title-lg: 0px; --text-title-lg--font-weight: 600; --font-weight-title-lg: 600; --text-title-md: 30px; --text-title-md--line-height: 32px; --leading-title-md: 32px; --text-title-md--letter-spacing: 0px; --tracking-title-md: 0px; --text-title-md--font-weight: 600; --font-weight-title-md: 600; --text-title-sm: 22px; --text-title-sm--line-height: 25px; --leading-title-sm: 25px; --text-title-sm--letter-spacing: 0px; --tracking-title-sm: 0px; --text-title-sm--font-weight: 600; --font-weight-title-sm: 600; --text-body-lg: 18px; --text-body-lg--line-height: 27px; --leading-body-lg: 27px; --text-body-lg--letter-spacing: 0px; --tracking-body-lg: 0px; --text-body-lg--font-weight: 400; --font-weight-body-lg: 400; --text-body-md: 16px; --text-body-md--line-height: 25px; --leading-body-md: 25px; --text-body-md--letter-spacing: 0px; --tracking-body-md: 0px; --text-body-md--font-weight: 400; --font-weight-body-md: 400; --text-body-md-strong: 16px; --text-body-md-strong--line-height: 24px; --leading-body-md-strong: 24px; --text-body-md-strong--letter-spacing: 0px; --tracking-body-md-strong: 0px; --text-body-md-strong--font-weight: 500; --font-weight-body-md-strong: 500; --text-body-sm: 14px; --text-body-sm--line-height: 20px; --leading-body-sm: 20px; --text-body-sm--letter-spacing: 0px; --tracking-body-sm: 0px; --text-body-sm--font-weight: 400; --font-weight-body-sm: 400; --text-body-sm-strong: 14px; --text-body-sm-strong--line-height: 20px; --leading-body-sm-strong: 20px; --text-body-sm-strong--letter-spacing: 0px; --tracking-body-sm-strong: 0px; --text-body-sm-strong--font-weight: 500; --font-weight-body-sm-strong: 500; --text-caption: 12px; --text-caption--line-height: 16px; --leading-caption: 16px; --text-caption--letter-spacing: 0px; --tracking-caption: 0px; --text-caption--font-weight: 400; --font-weight-caption: 400; --text-caption-strong: 12px; --text-caption-strong--line-height: 16px; --leading-caption-strong: 16px; --text-caption-strong--letter-spacing: 0px; --tracking-caption-strong: 0px; --text-caption-strong--font-weight: 500; --font-weight-caption-strong: 500; --text-caption-mono: 12px; --text-caption-mono--line-height: 16px; --leading-caption-mono: 16px; --text-caption-mono--letter-spacing: 0px; --tracking-caption-mono: 0px; --text-caption-mono--font-weight: 500; --font-weight-caption-mono: 500; --text-code: 13px; --text-code--line-height: 20px; --leading-code: 20px; --text-code--letter-spacing: 0px; --tracking-code: 0px; --text-code--font-weight: 400; --font-weight-code: 400; --text-button-md: 14px; --text-button-md--line-height: 18px; --leading-button-md: 18px; --text-button-md--letter-spacing: 0px; --tracking-button-md: 0px; --text-button-md--font-weight: 500; --font-weight-button-md: 500; --text-button-lg: 16px; --text-button-lg--line-height: 24px; --leading-button-lg: 24px; --text-button-lg--letter-spacing: 0px; --tracking-button-lg: 0px; --text-button-lg--font-weight: 500; --font-weight-button-lg: 500; --radius-none: 0px; --radius-xs: 2px; --radius-sm: 4px; --radius-md: 6px; --radius-lg: 8px; --radius-xl: 10px; --radius-2xl: 12px; --radius-3xl: 16px; --radius-pill-sm: 64px; --radius-pill: 100px; --radius-full: 9999px; --ring-width-focus: var(--spacing-nadicode-focus-ring-width); --opacity-scrim: var(--nc-material-scrim-opacity); --shadow-tooltip: var(--nc-material-shadow-tooltip); --shadow-menu: var(--nc-material-shadow-menu); --shadow-dialog: var(--nc-material-shadow-dialog); --shadow-sheet: var(--nc-material-shadow-sheet); --spacing-nadicode-xxs: 4px; --spacing-nadicode-filter-chip-gap: 6px; --spacing-nadicode-xs: 8px; --spacing-nadicode-sm: 12px; --spacing-nadicode-md: 16px; --spacing-nadicode-lg: 24px; --spacing-nadicode-xl: 32px; --spacing-nadicode-2xl: 40px; --spacing-nadicode-3xl: 48px; --spacing-nadicode-4xl: 64px; --spacing-nadicode-5xl: 96px; --spacing-nadicode-6xl: 128px; --spacing-nadicode-section: 192px; --spacing-nadicode-guide: 1px; --spacing-nadicode-icon-stroke: 1.6px; --spacing-nadicode-focus-ring-width: 3px; --spacing-nadicode-control-height: 32px; --spacing-nadicode-control-padding-inline: 10px; --spacing-nadicode-touch-target: 44px; --spacing-nadicode-page-pad: 24px; --spacing-nadicode-page-max-mobile: 448px; --spacing-nadicode-page-max-tablet: 624px; --spacing-nadicode-page-max-desktop: 1440px; --spacing-nadicode-frame-max: 1392px; --spacing-nadicode-frame-gap: 24px; --spacing-nadicode-cell-padding: 24px; --spacing-nadicode-section-gap: 48px; --spacing-nadicode-cross-size-mobile: 11px; --spacing-nadicode-cross-size-tablet: 15px; --spacing-nadicode-cross-size-desktop: 21px; --spacing-nadicode-h-strip-mobile: 72px; --spacing-nadicode-h-strip-tablet: 80px; --spacing-nadicode-h-strip-desktop: 88px; --spacing-nadicode-h-cell-sm: 120px; --spacing-nadicode-h-cell-md-mobile: 144px; --spacing-nadicode-h-cell-md-tablet: 160px; --spacing-nadicode-h-cell-md-desktop: 168px; --spacing-nadicode-h-cell-lg-mobile: 220px; --spacing-nadicode-h-cell-lg-desktop: 240px; --spacing-nadicode-h-visual-mobile: 276px; --spacing-nadicode-h-visual-tablet: 318px; --spacing-nadicode-h-visual-desktop: 360px; --spacing-nadicode-h-precision-mobile: 276px; --spacing-nadicode-h-precision-tablet: 480px; --spacing-nadicode-h-precision-desktop: 720px; --spacing-nadicode-h-hero-mobile: 560px; --spacing-nadicode-h-hero-desktop: 720px; --spacing-nadicode-h-action-strip-mobile: 20px; --spacing-nadicode-h-action-strip-desktop: 32px; --spacing-nadicode-h-action-body-mobile: 320px; --spacing-nadicode-h-action-body-tablet: 338px; --spacing-nadicode-h-action-band: 260px; --spacing-nadicode-h-feature-mobile: 360px; --spacing-nadicode-h-feature-tablet: 400px; --spacing-nadicode-h-feature-desktop: 456px; --spacing-nadicode-h-editorial-feature-mobile: 360px; --spacing-nadicode-h-editorial-feature-tablet: 440px; --spacing-nadicode-h-editorial-feature-desktop: 560px; --spacing-nadicode-h-bento-primary: 384px; --spacing-nadicode-h-bento-secondary: 240px; --spacing-nadicode-h-bento-mobile-copy: 248px; --spacing-nadicode-h-bento-mobile-main: 537px; --spacing-nadicode-h-bento-strip: 20px; --spacing-nadicode-filter-chip-height: 28px; --spacing-nadicode-filter-chip-icon: 14px; --spacing-control-height: var(--spacing-nadicode-control-height); --spacing-control-padding-inline: var(--spacing-nadicode-control-padding-inline); --spacing-touch-target: var(--spacing-nadicode-touch-target); }
 }
 
 /* src/css/reset.css */

package/dist/tailwind/nadicode.tailwind.json

@@ -56,9 +56,9 @@
         "campo-bianco": "#ffffff",
         "chart-1": "#1e3cff",
         "chart-2": "#00a85a",
-        "chart-3": "#ffc220",
+        "chart-3": "#ddaa00",
         "chart-4": "#d3302f",
-        "chart-5": "#00838f",
+        "chart-5": "#0096a7",
         "chart-6": "#6f42c1",
         "chart-seq-1": "#7d99f2",
         "chart-seq-2": "#4f6ae6",

package/dist/tokens/nadicode.dtcg.json

@@ -602,11 +602,11 @@
         "$value": {
           "colorSpace": "srgb",
           "components": [
-            1,
-            0.761,
-            0.125
+            0.867,
+            0.667,
+            0
           ],
-          "hex": "#ffc220"
+          "hex": "#ddaa00"
         }
       },
       "chart-4": {
@@ -625,10 +625,10 @@
           "colorSpace": "srgb",
           "components": [
             0,
-            0.514,
-            0.561
+            0.588,
+            0.655
           ],
-          "hex": "#00838f"
+          "hex": "#0096a7"
         }
       },
       "chart-6": {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nadicodeai/design-system",
-  "version": "0.17.0",
+  "version": "0.18.0",
   "type": "module",
   "publishConfig": {
     "access": "public"
@@ -116,9 +116,21 @@
       "import": "./src/assets/logo-geometry.js",
       "default": "./src/assets/logo-geometry.js"
     },
-    "./assets/nadia-canonical-face": {
-      "types": "./src/assets/nadia-canonical-face.d.ts",
-      "default": "./dist/assets/nadia-canonical-face.png"
+    "./assets/nadia-solid-surface": {
+      "types": "./src/assets/nadia-material-state.d.ts",
+      "default": "./dist/assets/nadia-01-solid-surface.png"
+    },
+    "./assets/nadia-ordered-points": {
+      "types": "./src/assets/nadia-material-state.d.ts",
+      "default": "./dist/assets/nadia-02-ordered-points.png"
+    },
+    "./assets/nadia-triangulated-wire": {
+      "types": "./src/assets/nadia-material-state.d.ts",
+      "default": "./dist/assets/nadia-03-triangulated-wire.png"
+    },
+    "./assets/nadia-irregular-particles": {
+      "types": "./src/assets/nadia-material-state.d.ts",
+      "default": "./dist/assets/nadia-04-irregular-particles.png"
     },
     "./assets/fonts/geist.css": "./src/assets/fonts/geist.css",
     "./assets/fonts/*": "./src/assets/fonts/*"