@hanzo/design 0.2.0 → 0.3.1

package/LICENSE

@@ -1,21 +1,28 @@
-MIT License
+BSD 3-Clause License
 
 Copyright (c) 2026 Hanzo AI, Inc.
 
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
+Redistribution and use in source and binary forms, with or without
+modification, are permitted provided that the following conditions are met:
 
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
+1. Redistributions of source code must retain the above copyright notice, this
+   list of conditions and the following disclaimer.
 
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+2. Redistributions in binary form must reproduce the above copyright notice,
+   this list of conditions and the following disclaimer in the documentation
+   and/or other materials provided with the distribution.
+
+3. Neither the name of the copyright holder nor the names of its
+   contributors may be used to endorse or promote products derived from
+   this software without specific prior written permission.
+
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS"
+AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
+IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE
+DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT HOLDER OR CONTRIBUTORS BE LIABLE
+FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL
+DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR
+SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER
+CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY,
+OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

package/README.md

@@ -6,18 +6,38 @@
 
 The single source of truth for how every Hanzo surface looks — tokens, components, brand assets, and the guidelines that hold them together.
 
-`@hanzoai/design`
+`@hanzo/design`
 
 </div>
 
+## If you are an agent
+
+Read [`skills/design-system/SKILL.md`](skills/design-system/SKILL.md). It is the
+**one** way an AI surface learns this design system — chat, hanzo.app and Claude
+Code all load the same file, so there is a single author and nothing to drift.
+It ends by running the gate below, which is what makes the rules enforceable
+rather than advisory:
+
+```sh
+npx hanzo-design-lint <paths…>
+```
+
+`prompts/` holds the longer material the skill points at. It is reference, not a
+second entry point.
+
 ## Use it
 
-One import pulls in the whole token layer (fonts, color, type, spacing, radius, elevation, motion):
+One import pulls in the whole token layer — fonts, colour, type, spacing, radius,
+elevation, motion, **z**, base:
 
 ```css
 @import "@hanzo/design/styles.css";
 ```
 
+Import the **whole** file. Cherry-picking `tokens/*.css` is how surfaces ended up
+without the z ladder or the elevation ramp. The fonts are self-hosted, so this
+makes **no third-party request** — there is no longer a reason to skip a part of it.
+
 ### Programmatic tokens (control look & feel from code)
 
 The same tokens are exposed to TypeScript — **generated from the CSS**, so the two
@@ -44,8 +64,8 @@ Groups: `colors`, `typography`, `spacing`, `radius`, `elevation`, `motion`, `zIn
 Everything below is expressed as CSS custom properties, so code copies over 1:1 — the semantic names match `hanzo.ai`'s variables exactly.
 
 ```jsx
-import { Button } from "@hanzoai/design/components/core/Button.jsx";
-import { HanzoLogo } from "@hanzoai/design/components/core/HanzoLogo.jsx";
+import { Button } from "@hanzo/design/components/core/Button.jsx";
+import { HanzoLogo } from "@hanzo/design/components/core/HanzoLogo.jsx";
 
 <Button pill>Try Hanzo</Button>
 ```
@@ -61,13 +81,42 @@ import { HanzoLogo } from "@hanzoai/design/components/core/HanzoLogo.jsx";
 | `content/` | The words — brand voice and taglines. |
 | `docs/` | How to use the system — integrate the tokens, theme, extend. |
 | `guidelines/` | Specimen cards — color, type, spacing, brand, iconography — the visual reference. |
+| `assets/fonts/` | Geist Sans + Geist Mono, self-hosted (two variable `.woff2`, 141 KB, SIL OFL-1.1). No Google Fonts request. |
 | `assets/` | The mark, wordmark, favicon, provider + partner logos, brand imagery. |
+| `scripts/check-tokens.mjs` | The gate: every token file is served, every internal `var()` resolves, and the contrast floors hold. Runs on `npm run build`. |
 | `ui_kits/` | Composed surfaces (e.g. `SiteChrome`) assembled from the components. |
 
+## Two kinds of boundary
+
+Not interchangeable, and the difference is a conformance requirement rather than
+a matter of taste:
+
+| Token | Kind | Contrast |
+|---|---|---|
+| `--border`, `--border-hairline`, `--border-card` | **decorative** — separates content | none required |
+| `--border-strong` | **perceivable** — identifies a *control* (input edge, switch, checkbox) | ≥ 3:1, WCAG 1.4.11 |
+| `--ring` | the focus indicator | ≥ 3:1, WCAG 2.4.11 |
+
+Reach for `--border-strong` whenever the boundary **is** the affordance. Both
+conformant tokens resolve to `--neutral-500`, the only rung on this ladder that
+clears 3:1 on every surface in **both** themes — `scripts/check-tokens.mjs`
+measures this on every build and fails if it ever stops being true.
+
+Note that the `--white-*` opacity ladder does **not** invert in light theme, so
+`--white-40` is white-on-white there. Anything needing a visible edge in both
+themes must use `--border-strong`.
+
 ## Principles
 
 - **Monochrome by construction** — one neutral ladder plus an opacity ladder is the entire palette. Color appears only as genuine semantics (live/error/warning).
 - **Dark is the default theme** — surfaces mount dark-first; light is the override.
+- **A token that is referenced must resolve** — an undefined custom property paints
+  *nothing*, silently. `cssVar()` therefore accepts only real token names (a typo
+  is a compile error) and emits the authored literal as a fallback, so a reference
+  still paints on a host that has not loaded the CSS.
+- **White-label by fork** — `@luxfi/design` and `@zooai/design` carry the same token
+  *names* over their own values. A change here must be measured against all three
+  before it ships; one that fixes Hanzo and breaks Zoo is a regression.
 - **Self-contained components** — inline styles, no CSS-framework coupling, so a component drops into any host (Next, Vite, Tamagui, none) and renders identically.
 - **Every component ships its own `.prompt.md`** — a one-screen usage guide for humans and AI alike.
 
@@ -77,4 +126,4 @@ Tokens track `hanzo.ai` (`app/globals.css`, `tailwind.config.ts`, `DESIGN.md`) a
 
 ## License
 
-MIT. Brand marks (the Hanzo logo, partner and provider logos) are the property of their respective owners and are provided for identification.
+BSD-3-Clause. Brand marks (the Hanzo logo, partner and provider logos) are the property of their respective owners and are provided for identification.

package/assets/fonts/LICENSE-Geist.txt

@@ -0,0 +1,92 @@
+Copyright (c) 2023 Vercel, in collaboration with basement.studio
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded,
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION AND CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

package/components/core/HanzoLogo.jsx

@@ -22,7 +22,7 @@ export function HanzoWordmark({ size = 22, label = 'Hanzo AI', variant = 'white'
   return (
     <span style={{ display: 'inline-flex', alignItems: 'center', gap: 8, ...style }}>
       <HanzoLogo size={size} variant={variant} />
-      <span style={{ fontSize: 15, fontWeight: 600, letterSpacing: 'var(--tracking-tight)', color: 'var(--text-primary)' }}>{label}</span>
+      <span style={{ fontSize: 'var(--text-sm)', fontWeight: 600, letterSpacing: 'var(--tracking-tight)', color: 'var(--text-primary)' }}>{label}</span>
     </span>
   )
 }

package/components/overlays/Dialog.jsx

@@ -11,7 +11,7 @@ export function Dialog({ open, onOpenChange, children }) {
   return (
     <div
       onClick={() => onOpenChange && onOpenChange(false)}
-      style={{position:'fixed',inset:0,zIndex:80,display:'flex',alignItems:'center',justifyContent:'center',padding:24,background:'rgb(0 0 0 / .8)',backdropFilter:'blur(4px)',animation:'hanzo-fade-up var(--duration-fast) var(--ease-out)'}}
+      style={{position:'fixed',inset:0,zIndex:'var(--z-modal)',display:'flex',alignItems:'center',justifyContent:'center',padding:24,background:'var(--surface-scrim)',backdropFilter:'blur(4px)',animation:'hanzo-fade-up var(--duration-fast) var(--ease-out)'}}
     >
       {children}
     </div>

package/components/overlays/DropdownMenu.jsx

@@ -18,7 +18,7 @@ export function DropdownMenu({ align = 'right', hover = false, trigger, style, c
     >
       <span onClick={() => setOpen((v) => !v)} style={{display:'inline-flex'}}>{trigger}</span>
       {open && (
-        <div style={{position:'absolute',top:'100%',[align]:0,paddingTop:12,zIndex:70,minWidth:208}}>
+        <div style={{position:'absolute',top:'100%',[align]:0,paddingTop:12,zIndex:'var(--z-dropdown)',minWidth:208}}>
           <div style={{display:'flex',flexDirection:'column',padding:8,background:'var(--surface-overlay)',border:'1px solid var(--border-hairline)',borderRadius:'var(--radius-xl)',boxShadow:'var(--shadow-floating)',backdropFilter:'blur(16px)',animation:'hanzo-fade-down var(--duration-fast) var(--ease-out)'}}>
             {children}
           </div>

package/components/overlays/Sheet.jsx

@@ -12,7 +12,7 @@ export function Sheet({ open, onOpenChange, side = 'right', width = 380, childre
     ? { left: 0, top: 0, bottom: 0, width, borderRight: '1px solid var(--border-hairline)' }
     : { right: 0, top: 0, bottom: 0, width, borderLeft: '1px solid var(--border-hairline)' }
   return (
-    <div onClick={() => onOpenChange && onOpenChange(false)} style={{position:'fixed',inset:0,zIndex:80,background:'rgb(0 0 0 / .7)'}}>
+    <div onClick={() => onOpenChange && onOpenChange(false)} style={{position:'fixed',inset:0,zIndex:'var(--z-modal)',background:'var(--surface-scrim)'}}>
       <div
         onClick={(e) => e.stopPropagation()}
         style={{position:'absolute',display:'flex',flexDirection:'column',background:'var(--popover)',boxShadow:'var(--shadow-floating)',animation:'hanzo-fade-up var(--duration-base) var(--ease-out)',...pos}}

package/components/overlays/Toaster.jsx

@@ -29,7 +29,7 @@ export function Toaster({ duration = 3500, position = 'bottom-right' }) {
   }, [duration])
   const anchor = position === 'top-right' ? { top: 24, right: 24 } : { bottom: 24, right: 24 }
   return (
-    <div style={{position:'fixed',zIndex:90,display:'flex',flexDirection:'column',gap:8,...anchor}}>
+    <div style={{position:'fixed',zIndex:'var(--z-toast)',display:'flex',flexDirection:'column',gap:8,...anchor}}>
       {items.map((i) => (
         <div key={i.id} style={{
           minWidth:260,maxWidth:380,padding:'12px 14px',display:'flex',alignItems:'flex-start',gap:10,

package/dist/index.d.ts

@@ -1,14 +1,25 @@
 export * from './tokens.gen.js';
 import { type CssVarName } from './tokens.gen.js';
+/** A token name with the leading `--` omitted: `'background'` for `'--background'`. */
+export type TokenName = CssVarName extends `--${infer N}` ? N : never;
 /**
- * A `var(--name[, fallback])` reference to a token — the ONE way code should
- * reach a token so it resolves through the live CSS cascade (honoring the
- * viewer's light/dark theme) rather than baking a fixed value.
+ * A `var(--name, <authored literal>)` reference to a token — the ONE way code
+ * should reach a token, so it resolves through the live CSS cascade (honoring
+ * the viewer's light/dark theme and any brand fork) rather than baking a value.
  *
- *   background: cssVar('--background')      // → "var(--background)"
- *   color:      cssVar('--foreground', '#fff')
+ *   background: cssVar('--background')      // → "var(--background, #000000)"
+ *   color:      cssVar('foreground', '#fff')// → "var(--foreground, #fff)"
+ *
+ * The name is checked AGAINST THE STYLESHEET at compile time. That check used to
+ * be opted out of with `| (string & {})`, which is how `cssVar('surface-1')`
+ * shipped: the token did not exist, `var(--surface-1)` resolved to nothing, and
+ * a menu painted transparent with no error anywhere. An undefined custom
+ * property fails SILENTLY, so the type is the only place it can be caught.
+ *
+ * When no explicit fallback is given the token's own authored literal is used,
+ * so the reference still paints on a host that has not loaded the CSS layer.
  */
-export declare function cssVar(name: CssVarName | (string & {}), fallback?: string): string;
+export declare function cssVar(name: CssVarName | TokenName, fallback?: string): string;
 /** The raw authored value of a token (the literal from the CSS), or `undefined`. */
 export declare function tokenValue(name: CssVarName): string | undefined;
 /**
@@ -16,6 +27,10 @@ export declare function tokenValue(name: CssVarName): string | undefined;
  * cannot use a bundler CSS import (e.g. a runtime-mounted island). Prefer the
  * static `import '@hanzo/design/styles.css'` where a bundler is available.
  * No-op outside the browser.
+ *
+ * `href` is REQUIRED: this used to default to esm.sh, which silently made a
+ * third-party CDN the origin of the entire token layer for anyone who called it
+ * bare. Pass a URL you serve.
  */
-export declare function injectDesignCss(href?: string): void;
+export declare function injectDesignCss(href: string): void;
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAWA,cAAc,iBAAiB,CAAA;AAC/B,OAAO,EAAW,KAAK,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAE1D;;;;;;;GAOG;AACH,wBAAgB,MAAM,CAAC,IAAI,EAAE,UAAU,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAGlF;AAED,oFAAoF;AACpF,wBAAgB,UAAU,CAAC,IAAI,EAAE,UAAU,GAAG,MAAM,GAAG,SAAS,CAE/D;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,IAAI,SAA4C,GAAG,IAAI,CAQtF"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAWA,cAAc,iBAAiB,CAAA;AAC/B,OAAO,EAAW,KAAK,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAE1D,uFAAuF;AACvF,MAAM,MAAM,SAAS,GAAG,UAAU,SAAS,KAAK,MAAM,CAAC,EAAE,GAAG,CAAC,GAAG,KAAK,CAAA;AAErE;;;;;;;;;;;;;;;;GAgBG;AACH,wBAAgB,MAAM,CAAC,IAAI,EAAE,UAAU,GAAG,SAAS,EAAE,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAI9E;AAED,oFAAoF;AACpF,wBAAgB,UAAU,CAAC,IAAI,EAAE,UAAU,GAAG,MAAM,GAAG,SAAS,CAE/D;AAED;;;;;;;;;GASG;AACH,wBAAgB,eAAe,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,CAQlD"}

package/dist/index.js

@@ -12,16 +12,26 @@
 export * from './tokens.gen.js';
 import { cssVars } from './tokens.gen.js';
 /**
- * A `var(--name[, fallback])` reference to a token — the ONE way code should
- * reach a token so it resolves through the live CSS cascade (honoring the
- * viewer's light/dark theme) rather than baking a fixed value.
+ * A `var(--name, <authored literal>)` reference to a token — the ONE way code
+ * should reach a token, so it resolves through the live CSS cascade (honoring
+ * the viewer's light/dark theme and any brand fork) rather than baking a value.
  *
- *   background: cssVar('--background')      // → "var(--background)"
- *   color:      cssVar('--foreground', '#fff')
+ *   background: cssVar('--background')      // → "var(--background, #000000)"
+ *   color:      cssVar('foreground', '#fff')// → "var(--foreground, #fff)"
+ *
+ * The name is checked AGAINST THE STYLESHEET at compile time. That check used to
+ * be opted out of with `| (string & {})`, which is how `cssVar('surface-1')`
+ * shipped: the token did not exist, `var(--surface-1)` resolved to nothing, and
+ * a menu painted transparent with no error anywhere. An undefined custom
+ * property fails SILENTLY, so the type is the only place it can be caught.
+ *
+ * When no explicit fallback is given the token's own authored literal is used,
+ * so the reference still paints on a host that has not loaded the CSS layer.
  */
 export function cssVar(name, fallback) {
-    const n = name.startsWith('--') ? name : `--${name}`;
-    return fallback ? `var(${n}, ${fallback})` : `var(${n})`;
+    const n = (name.startsWith('--') ? name : `--${name}`);
+    const lit = fallback ?? cssVars[n];
+    return lit ? `var(${n}, ${lit})` : `var(${n})`;
 }
 /** The raw authored value of a token (the literal from the CSS), or `undefined`. */
 export function tokenValue(name) {
@@ -32,8 +42,12 @@ export function tokenValue(name) {
  * cannot use a bundler CSS import (e.g. a runtime-mounted island). Prefer the
  * static `import '@hanzo/design/styles.css'` where a bundler is available.
  * No-op outside the browser.
+ *
+ * `href` is REQUIRED: this used to default to esm.sh, which silently made a
+ * third-party CDN the origin of the entire token layer for anyone who called it
+ * bare. Pass a URL you serve.
  */
-export function injectDesignCss(href = 'https://esm.sh/@hanzo/design/styles.css') {
+export function injectDesignCss(href) {
     if (typeof document === 'undefined')
         return;
     if (document.querySelector('link[data-hanzo-design]'))

package/dist/tokens.gen.d.ts

@@ -41,7 +41,7 @@ export declare const colors: {
     readonly 'destructive-foreground': "#f5f5f5";
     readonly border: "#1f1f1f";
     readonly input: "#1f1f1f";
-    readonly ring: "#333333";
+    readonly ring: "var(--neutral-500)";
     readonly brand: "#e4e4e7";
     readonly 'brand-foreground': "#09090b";
     readonly 'brand-muted': "#a3a3a3";
@@ -53,9 +53,14 @@ export declare const colors: {
     readonly 'surface-card-quiet': "rgb(23 23 23 / .4)";
     readonly 'surface-overlay': "rgb(10 10 10 / .95)";
     readonly 'surface-header': "rgb(0 0 0 / .7)";
+    readonly 'surface-scrim': "rgb(0 0 0 / .8)";
     readonly 'border-hairline': "var(--neutral-800)";
     readonly 'border-card': "var(--white-10)";
-    readonly 'border-strong': "var(--neutral-700)";
+    readonly 'border-strong': "var(--neutral-500)";
+    readonly 'surface-0': "var(--background)";
+    readonly 'surface-1': "var(--card)";
+    readonly 'surface-2': "var(--muted)";
+    readonly 'surface-3': "var(--secondary)";
     readonly 'text-primary': "var(--pure-white)";
     readonly 'text-secondary': "var(--white-80)";
     readonly 'text-tertiary': "var(--white-60)";
@@ -94,6 +99,23 @@ export declare const typography: {
     readonly 'leading-6xl': "1";
     readonly 'text-7xl': "4rem";
     readonly 'leading-7xl': "1";
+    readonly 'text-8xl': "5.25rem";
+    readonly 'leading-8xl': "1";
+    readonly 'text-9xl': "7rem";
+    readonly 'leading-9xl': "1";
+    readonly 'font-size-xs': "var(--text-xs)";
+    readonly 'font-size-sm': "var(--text-sm)";
+    readonly 'font-size-base': "var(--text-base)";
+    readonly 'font-size-lg': "var(--text-lg)";
+    readonly 'font-size-xl': "var(--text-xl)";
+    readonly 'font-size-2xl': "var(--text-2xl)";
+    readonly 'font-size-3xl': "var(--text-3xl)";
+    readonly 'font-size-4xl': "var(--text-4xl)";
+    readonly 'font-size-5xl': "var(--text-5xl)";
+    readonly 'font-size-6xl': "var(--text-6xl)";
+    readonly 'font-size-7xl': "var(--text-7xl)";
+    readonly 'font-size-8xl': "var(--text-8xl)";
+    readonly 'font-size-9xl': "var(--text-9xl)";
     readonly 'weight-normal': "400";
     readonly 'weight-medium': "500";
     readonly 'weight-semibold': "600";
@@ -173,6 +195,12 @@ export declare const elevation: {
     readonly 'shadow-floating': "0 25px 50px -12px rgb(0 0 0 / .25)";
     readonly 'shadow-inset-hairline': "inset 0 0 0 1px var(--white-10)";
     readonly 'ring-focus': "0 0 0 2px var(--ring)";
+    readonly 'shadow-sm': "0 1px 2px 0 rgb(0 0 0 / .40)";
+    readonly shadow: "0 1px 3px 0 rgb(0 0 0 / .45), 0 1px 2px -1px rgb(0 0 0 / .45)";
+    readonly 'shadow-md': "0 4px 6px -1px rgb(0 0 0 / .50), 0 2px 4px -2px rgb(0 0 0 / .50)";
+    readonly 'shadow-lg': "0 10px 15px -3px rgb(0 0 0 / .55), 0 4px 6px -4px rgb(0 0 0 / .55)";
+    readonly 'shadow-xl': "0 20px 25px -5px rgb(0 0 0 / .60), 0 8px 10px -6px rgb(0 0 0 / .60)";
+    readonly 'shadow-2xl': "var(--shadow-floating)";
     readonly 'glow-hero': "radial-gradient(circle,rgb(255 255 255 / .12) 0%,transparent 68%)";
     readonly 'glow-hero-blur': "120px";
     readonly 'sheen-card': "radial-gradient(120% 120% at 80% 0%,rgb(255 255 255 / .08) 0%,transparent 55%)";
@@ -204,6 +232,8 @@ export declare const zIndex: {
     readonly 'z-modal': "600";
     readonly 'z-popover': "700";
     readonly 'z-toast': "800";
+    readonly 'z-tooltip': "var(--z-popover)";
+    readonly 'z-notification': "var(--z-toast)";
 };
 /** fonts tokens (from tokens/fonts.css). Values are raw CSS. */
 export declare const fonts: {
@@ -258,7 +288,7 @@ export declare const cssVars: {
     readonly '--destructive-foreground': "#f5f5f5";
     readonly '--border': "#1f1f1f";
     readonly '--input': "#1f1f1f";
-    readonly '--ring': "#333333";
+    readonly '--ring': "var(--neutral-500)";
     readonly '--brand': "#e4e4e7";
     readonly '--brand-foreground': "#09090b";
     readonly '--brand-muted': "#a3a3a3";
@@ -270,9 +300,14 @@ export declare const cssVars: {
     readonly '--surface-card-quiet': "rgb(23 23 23 / .4)";
     readonly '--surface-overlay': "rgb(10 10 10 / .95)";
     readonly '--surface-header': "rgb(0 0 0 / .7)";
+    readonly '--surface-scrim': "rgb(0 0 0 / .8)";
     readonly '--border-hairline': "var(--neutral-800)";
     readonly '--border-card': "var(--white-10)";
-    readonly '--border-strong': "var(--neutral-700)";
+    readonly '--border-strong': "var(--neutral-500)";
+    readonly '--surface-0': "var(--background)";
+    readonly '--surface-1': "var(--card)";
+    readonly '--surface-2': "var(--muted)";
+    readonly '--surface-3': "var(--secondary)";
     readonly '--text-primary': "var(--pure-white)";
     readonly '--text-secondary': "var(--white-80)";
     readonly '--text-tertiary': "var(--white-60)";
@@ -308,6 +343,23 @@ export declare const cssVars: {
     readonly '--leading-6xl': "1";
     readonly '--text-7xl': "4rem";
     readonly '--leading-7xl': "1";
+    readonly '--text-8xl': "5.25rem";
+    readonly '--leading-8xl': "1";
+    readonly '--text-9xl': "7rem";
+    readonly '--leading-9xl': "1";
+    readonly '--font-size-xs': "var(--text-xs)";
+    readonly '--font-size-sm': "var(--text-sm)";
+    readonly '--font-size-base': "var(--text-base)";
+    readonly '--font-size-lg': "var(--text-lg)";
+    readonly '--font-size-xl': "var(--text-xl)";
+    readonly '--font-size-2xl': "var(--text-2xl)";
+    readonly '--font-size-3xl': "var(--text-3xl)";
+    readonly '--font-size-4xl': "var(--text-4xl)";
+    readonly '--font-size-5xl': "var(--text-5xl)";
+    readonly '--font-size-6xl': "var(--text-6xl)";
+    readonly '--font-size-7xl': "var(--text-7xl)";
+    readonly '--font-size-8xl': "var(--text-8xl)";
+    readonly '--font-size-9xl': "var(--text-9xl)";
     readonly '--weight-normal': "400";
     readonly '--weight-medium': "500";
     readonly '--weight-semibold': "600";
@@ -378,6 +430,12 @@ export declare const cssVars: {
     readonly '--shadow-floating': "0 25px 50px -12px rgb(0 0 0 / .25)";
     readonly '--shadow-inset-hairline': "inset 0 0 0 1px var(--white-10)";
     readonly '--ring-focus': "0 0 0 2px var(--ring)";
+    readonly '--shadow-sm': "0 1px 2px 0 rgb(0 0 0 / .40)";
+    readonly '--shadow': "0 1px 3px 0 rgb(0 0 0 / .45), 0 1px 2px -1px rgb(0 0 0 / .45)";
+    readonly '--shadow-md': "0 4px 6px -1px rgb(0 0 0 / .50), 0 2px 4px -2px rgb(0 0 0 / .50)";
+    readonly '--shadow-lg': "0 10px 15px -3px rgb(0 0 0 / .55), 0 4px 6px -4px rgb(0 0 0 / .55)";
+    readonly '--shadow-xl': "0 20px 25px -5px rgb(0 0 0 / .60), 0 8px 10px -6px rgb(0 0 0 / .60)";
+    readonly '--shadow-2xl': "var(--shadow-floating)";
     readonly '--glow-hero': "radial-gradient(circle,rgb(255 255 255 / .12) 0%,transparent 68%)";
     readonly '--glow-hero-blur': "120px";
     readonly '--sheen-card': "radial-gradient(120% 120% at 80% 0%,rgb(255 255 255 / .08) 0%,transparent 55%)";
@@ -403,6 +461,8 @@ export declare const cssVars: {
     readonly '--z-modal': "600";
     readonly '--z-popover': "700";
     readonly '--z-toast': "800";
+    readonly '--z-tooltip': "var(--z-popover)";
+    readonly '--z-notification': "var(--z-toast)";
     readonly '--font-sans': "\"Geist\",\"Geist Sans\",ui-sans-serif,system-ui,sans-serif";
     readonly '--font-display': "var(--font-sans)";
     readonly '--font-mono': "\"Geist Mono\",ui-monospace,SFMono-Regular,monospace";

package/dist/tokens.gen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tokens.gen.d.ts","sourceRoot":"","sources":["../src/tokens.gen.ts"],"names":[],"mappings":"AAIA,kEAAkE;AAClE,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsET,CAAA;AAEV,0EAA0E;AAC1E,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA6Cb,CAAA;AAEV,oEAAoE;AACpE,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqCV,CAAA;AAEV,kEAAkE;AAClE,eAAO,MAAM,MAAM;;;;;;;;;CAST,CAAA;AAEV,wEAAwE;AACxE,eAAO,MAAM,SAAS;;;;;;;;;;;CAWZ,CAAA;AAEV,kEAAkE;AAClE,eAAO,MAAM,MAAM;;;;;;;;;;;CAWT,CAAA;AAEV,6DAA6D;AAC7D,eAAO,MAAM,MAAM;;;;;;;;;;CAUT,CAAA;AAEV,gEAAgE;AAChE,eAAO,MAAM,KAAK;;;;;;CAMR,CAAA;AAEV,8DAA8D;AAC9D,eAAO,MAAM,IAAI,IAEP,CAAA;AAEV,sFAAsF;AACtF,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgMV,CAAA;AAEV,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,OAAO,CAAA"}
+{"version":3,"file":"tokens.gen.d.ts","sourceRoot":"","sources":["../src/tokens.gen.ts"],"names":[],"mappings":"AAIA,kEAAkE;AAClE,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2ET,CAAA;AAEV,0EAA0E;AAC1E,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8Db,CAAA;AAEV,oEAAoE;AACpE,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAqCV,CAAA;AAEV,kEAAkE;AAClE,eAAO,MAAM,MAAM;;;;;;;;;CAST,CAAA;AAEV,wEAAwE;AACxE,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;CAiBZ,CAAA;AAEV,kEAAkE;AAClE,eAAO,MAAM,MAAM;;;;;;;;;;;CAWT,CAAA;AAEV,6DAA6D;AAC7D,eAAO,MAAM,MAAM;;;;;;;;;;;;CAYT,CAAA;AAEV,gEAAgE;AAChE,eAAO,MAAM,KAAK;;;;;;CAMR,CAAA;AAEV,8DAA8D;AAC9D,eAAO,MAAM,IAAI,IAEP,CAAA;AAEV,sFAAsF;AACtF,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8NV,CAAA;AAEV,MAAM,MAAM,UAAU,GAAG,MAAM,OAAO,OAAO,CAAA"}