{ "$schema": "https://design.raihin.com/llms-tokens.schema.json", "generatedAt": "2026-05-08", "families": [ { "name": "blur", "title": "Blur", "subtitle": "Backdrop blur scale", "description": "Tunable. Three-step scale for translucent surfaces (sheets, blur backdrops)." }, { "name": "color", "title": "Color", "subtitle": "Surfaces, brand, status, state layers, charts", "description": "Locked names and pairings; brand-tunable values. Status uses the solid pattern (bg-{status} text-{status}-foreground), never bg-{status}/10." }, { "name": "density", "title": "Density", "subtitle": "Comfortable vs compact mode mapping", "description": "Driven by [data-density='compact'] on the root. Comfortable is the default. Locked structural mapping: only compact toggles the values." }, { "name": "focus-ring", "title": "Focus ring", "subtitle": "Pinned to 3px", "description": "Locked. --ring-width and --ring-offset are pinned across the system to keep the focus indicator consistent." }, { "name": "font", "title": "Font", "subtitle": "Sans, mono, heading, display", "description": "Brand. Nunito Sans for body, Merriweather for headings, Bodoni Moda for display, Geist Mono for code." }, { "name": "form", "title": "Form", "subtitle": "Field padding, label rhythm", "description": "Tunable. Affects FieldLabel → input → description spacing. --required-indicator-color and --placeholder-color also live here." }, { "name": "layout", "title": "Layout", "subtitle": "Container widths, sidebar widths", "description": "Tunable per project. Use these for content widths so consumer apps inherit your layout decisions." }, { "name": "motion", "title": "Motion", "subtitle": "Durations + easing curves", "description": "Tunable. The five-step duration scale and four named easings are the only valid motion vocabulary." }, { "name": "opacity", "title": "Opacity", "subtitle": "Disabled, hover, pressed, overlay, loading", "description": "Locked scale matching the state-layer opacities. Use these instead of inline /10 /20 /30 fractions." }, { "name": "radius", "title": "Radius", "subtitle": "Generic scale + semantic radii per registry component", "description": "Use semantic radii (rounded-button, rounded-card) for new code. The generic scale exists for unmigrated shadcn primitives." }, { "name": "shadow", "title": "Shadow", "subtitle": "Elevation tokens; --shadow-focus is locked", "description": "Tunable shadows for cards / popovers / overlays. --shadow-focus composes --ring-width and --ring and is locked." }, { "name": "sizing", "title": "Sizing", "subtitle": "Icon, avatar, control, touch-target sizes", "description": "Locked structural ratios. Compact density swaps --density-control-h between md and sm but the size scale itself is fixed." }, { "name": "z-index", "title": "Z-index", "subtitle": "Cross-product layering — never override", "description": "Locked at the system level. Overriding breaks layering across products in the family. Overlay=50, modal=popover=60, tooltip=70, toast=80." } ], "tokens": [ { "name": "--blur-lg", "aliasOf": null, "family": "blur", "tier": "tunable", "lightValue": "24px", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "24px", "comment": "tunable", "utility": { "blur": "blur-lg", "slug": "lg" } }, { "name": "--blur-md", "aliasOf": null, "family": "blur", "tier": "tunable", "lightValue": "12px", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "12px", "comment": "tunable", "utility": { "blur": "blur-md", "slug": "md" } }, { "name": "--blur-sm", "aliasOf": null, "family": "blur", "tier": "tunable", "lightValue": "4px", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "4px", "comment": "tunable", "utility": { "blur": "blur-sm", "slug": "sm" } }, { "name": "--color-destructive", "aliasOf": "--destructive", "family": "color", "tier": "locked", "lightValue": "oklch(0.92 0.05 27.325)", "darkValue": "oklch(0.32 0.1 27.325)", "rawLight": "oklch(0.92 0.05 27.325)", "rawDark": "oklch(0.32 0.1 27.325)", "themeMapping": "var(--destructive)", "comment": "hue locked (red ≈ 27); L/C tunable", "utility": { "bg": "bg-destructive", "text": "text-destructive", "border": "border-destructive", "ring": "ring-destructive", "raw": "text-(--color-destructive)", "slug": "destructive" } }, { "name": "--color-destructive-border", "aliasOf": "--destructive-border", "family": "color", "tier": "locked", "lightValue": "oklch(0.82 0.13 27.325)", "darkValue": "oklch(0.5 0.15 27.325)", "rawLight": "oklch(0.82 0.13 27.325)", "rawDark": "oklch(0.5 0.15 27.325)", "themeMapping": "var(--destructive-border)", "comment": "hue locked; L/C tunable", "utility": { "bg": "bg-destructive-border", "text": "text-destructive-border", "border": "border-destructive-border", "ring": "ring-destructive-border", "raw": "text-(--color-destructive-border)", "slug": "destructive-border" } }, { "name": "--color-destructive-foreground", "aliasOf": "--destructive-foreground", "family": "color", "tier": "locked", "lightValue": "oklch(0.5 0.2 27.325)", "darkValue": "oklch(0.85 0.13 27.325)", "rawLight": "oklch(0.5 0.2 27.325)", "rawDark": "oklch(0.85 0.13 27.325)", "themeMapping": "var(--destructive-foreground)", "comment": "hue locked; L/C tunable", "utility": { "bg": "bg-destructive-foreground", "text": "text-destructive-foreground", "border": "border-destructive-foreground", "ring": "ring-destructive-foreground", "raw": "text-(--color-destructive-foreground)", "slug": "destructive-foreground" } }, { "name": "--color-info", "aliasOf": "--info", "family": "color", "tier": "locked", "lightValue": "oklch(0.94 0.04 240)", "darkValue": "oklch(0.32 0.08 240)", "rawLight": "oklch(0.94 0.04 240)", "rawDark": "oklch(0.32 0.08 240)", "themeMapping": "var(--info)", "comment": "hue locked (blue ≈ 240); L/C tunable", "utility": { "bg": "bg-info", "text": "text-info", "border": "border-info", "ring": "ring-info", "raw": "text-(--color-info)", "slug": "info" } }, { "name": "--color-info-border", "aliasOf": "--info-border", "family": "color", "tier": "locked", "lightValue": "oklch(0.83 0.1 240)", "darkValue": "oklch(0.5 0.13 240)", "rawLight": "oklch(0.83 0.1 240)", "rawDark": "oklch(0.5 0.13 240)", "themeMapping": "var(--info-border)", "comment": "hue locked; L/C tunable", "utility": { "bg": "bg-info-border", "text": "text-info-border", "border": "border-info-border", "ring": "ring-info-border", "raw": "text-(--color-info-border)", "slug": "info-border" } }, { "name": "--color-info-foreground", "aliasOf": "--info-foreground", "family": "color", "tier": "locked", "lightValue": "oklch(0.45 0.17 240)", "darkValue": "oklch(0.85 0.12 240)", "rawLight": "oklch(0.45 0.17 240)", "rawDark": "oklch(0.85 0.12 240)", "themeMapping": "var(--info-foreground)", "comment": "hue locked; L/C tunable", "utility": { "bg": "bg-info-foreground", "text": "text-info-foreground", "border": "border-info-foreground", "ring": "ring-info-foreground", "raw": "text-(--color-info-foreground)", "slug": "info-foreground" } }, { "name": "--color-ring-invalid", "aliasOf": "--ring-color-invalid", "family": "color", "tier": "locked", "lightValue": "oklch(0.5 0.2 27.325)", "darkValue": null, "rawLight": "var(--destructive-foreground)", "rawDark": null, "themeMapping": "var(--ring-color-invalid)", "comment": "locked — aria-invalid ring (status hue, saturated to match error text)", "utility": { "bg": "bg-ring-invalid", "text": "text-ring-invalid", "border": "border-ring-invalid", "ring": "ring-ring-invalid", "raw": "text-(--color-ring-invalid)", "slug": "ring-invalid" } }, { "name": "--color-state-active", "aliasOf": "--state-active", "family": "color", "tier": "locked", "lightValue": "color-mix(in oklch, var(--foreground) 12%, transparent)", "darkValue": null, "rawLight": "color-mix(in oklch, var(--foreground) 12%, transparent)", "rawDark": null, "themeMapping": "var(--state-active)", "comment": "locked 12%", "utility": { "bg": "bg-state-active", "text": "text-state-active", "border": "border-state-active", "ring": "ring-state-active", "raw": "text-(--color-state-active)", "slug": "state-active" } }, { "name": "--color-state-expanded", "aliasOf": "--state-expanded", "family": "color", "tier": "locked", "lightValue": "color-mix(in oklch, var(--foreground) 4%, transparent)", "darkValue": null, "rawLight": "color-mix(in oklch, var(--foreground) 4%, transparent)", "rawDark": null, "themeMapping": "var(--state-expanded)", "comment": "locked 4% — large-area persistent states (accordion, collapsible)", "utility": { "bg": "bg-state-expanded", "text": "text-state-expanded", "border": "border-state-expanded", "ring": "ring-state-expanded", "raw": "text-(--color-state-expanded)", "slug": "state-expanded" } }, { "name": "--color-state-focus", "aliasOf": "--state-focus", "family": "color", "tier": "locked", "lightValue": "color-mix(in oklch, var(--foreground) 8%, transparent)", "darkValue": null, "rawLight": "color-mix(in oklch, var(--foreground) 8%, transparent)", "rawDark": null, "themeMapping": "var(--state-focus)", "comment": "locked 8%", "utility": { "bg": "bg-state-focus", "text": "text-state-focus", "border": "border-state-focus", "ring": "ring-state-focus", "raw": "text-(--color-state-focus)", "slug": "state-focus" } }, { "name": "--color-state-hover", "aliasOf": "--state-hover", "family": "color", "tier": "locked", "lightValue": "color-mix(in oklch, var(--foreground) 6%, transparent)", "darkValue": null, "rawLight": "color-mix(in oklch, var(--foreground) 6%, transparent)", "rawDark": null, "themeMapping": "var(--state-hover)", "comment": "locked 6%", "utility": { "bg": "bg-state-hover", "text": "text-state-hover", "border": "border-state-hover", "ring": "ring-state-hover", "raw": "text-(--color-state-hover)", "slug": "state-hover" } }, { "name": "--color-state-selected", "aliasOf": "--state-selected", "family": "color", "tier": "locked", "lightValue": "color-mix(in oklch, var(--foreground) 16%, transparent)", "darkValue": null, "rawLight": "color-mix(in oklch, var(--foreground) 16%, transparent)", "rawDark": null, "themeMapping": "var(--state-selected)", "comment": "locked 16%", "utility": { "bg": "bg-state-selected", "text": "text-state-selected", "border": "border-state-selected", "ring": "ring-state-selected", "raw": "text-(--color-state-selected)", "slug": "state-selected" } }, { "name": "--color-success", "aliasOf": "--success", "family": "color", "tier": "locked", "lightValue": "oklch(0.93 0.06 145)", "darkValue": "oklch(0.32 0.08 145)", "rawLight": "oklch(0.93 0.06 145)", "rawDark": "oklch(0.32 0.08 145)", "themeMapping": "var(--success)", "comment": "hue locked (green ≈ 145); L/C tunable", "utility": { "bg": "bg-success", "text": "text-success", "border": "border-success", "ring": "ring-success", "raw": "text-(--color-success)", "slug": "success" } }, { "name": "--color-success-border", "aliasOf": "--success-border", "family": "color", "tier": "locked", "lightValue": "oklch(0.82 0.12 145)", "darkValue": "oklch(0.5 0.12 145)", "rawLight": "oklch(0.82 0.12 145)", "rawDark": "oklch(0.5 0.12 145)", "themeMapping": "var(--success-border)", "comment": "hue locked; L/C tunable", "utility": { "bg": "bg-success-border", "text": "text-success-border", "border": "border-success-border", "ring": "ring-success-border", "raw": "text-(--color-success-border)", "slug": "success-border" } }, { "name": "--color-success-foreground", "aliasOf": "--success-foreground", "family": "color", "tier": "locked", "lightValue": "oklch(0.45 0.15 145)", "darkValue": "oklch(0.85 0.13 145)", "rawLight": "oklch(0.45 0.15 145)", "rawDark": "oklch(0.85 0.13 145)", "themeMapping": "var(--success-foreground)", "comment": "hue locked; L/C tunable", "utility": { "bg": "bg-success-foreground", "text": "text-success-foreground", "border": "border-success-foreground", "ring": "ring-success-foreground", "raw": "text-(--color-success-foreground)", "slug": "success-foreground" } }, { "name": "--color-warning-border", "aliasOf": "--warning-border", "family": "color", "tier": "locked", "lightValue": "oklch(0.82 0.12 60)", "darkValue": "oklch(0.5 0.12 60)", "rawLight": "oklch(0.82 0.12 60)", "rawDark": "oklch(0.5 0.12 60)", "themeMapping": "var(--warning-border)", "comment": "hue locked at 60; L/C tunable", "utility": { "bg": "bg-warning-border", "text": "text-warning-border", "border": "border-warning-border", "ring": "ring-warning-border", "raw": "text-(--color-warning-border)", "slug": "warning-border" } }, { "name": "--color-accent", "aliasOf": "--accent", "family": "color", "tier": "brand", "lightValue": "oklch(0.945 0.18 100)", "darkValue": "oklch(0.85 0.16 100)", "rawLight": "oklch(0.945 0.18 100)", "rawDark": "oklch(0.85 0.16 100)", "themeMapping": "var(--accent)", "comment": "brand — bright yellow #FFF162, the single brand highlight", "utility": { "bg": "bg-accent", "text": "text-accent", "border": "border-accent", "ring": "ring-accent", "raw": "text-(--color-accent)", "slug": "accent" } }, { "name": "--color-accent-foreground", "aliasOf": "--accent-foreground", "family": "color", "tier": "brand", "lightValue": "oklch(0.18 0.025 90)", "darkValue": "oklch(0.18 0.025 90)", "rawLight": "oklch(0.18 0.025 90)", "rawDark": "oklch(0.18 0.025 90)", "themeMapping": "var(--accent-foreground)", "comment": "brand — warm dark ink readable on bright yellow (#1A1505)", "utility": { "bg": "bg-accent-foreground", "text": "text-accent-foreground", "border": "border-accent-foreground", "ring": "ring-accent-foreground", "raw": "text-(--color-accent-foreground)", "slug": "accent-foreground" } }, { "name": "--color-background", "aliasOf": "--background", "family": "color", "tier": "brand", "lightValue": "oklch(1 0 0)", "darkValue": "oklch(0.17 0.006 50)", "rawLight": "oklch(1 0 0)", "rawDark": "oklch(0.17 0.006 50)", "themeMapping": "var(--background)", "comment": "brand — pure white canvas (#FFFFFF), the marketing inner page card", "utility": { "bg": "bg-background", "text": "text-background", "border": "border-background", "ring": "ring-background", "raw": "text-(--color-background)", "slug": "background" } }, { "name": "--color-border", "aliasOf": "--border", "family": "color", "tier": "brand", "lightValue": "oklch(0.88 0.005 95)", "darkValue": "oklch(1 0 0 / 10%)", "rawLight": "oklch(0.88 0.005 95)", "rawDark": "oklch(1 0 0 / 10%)", "themeMapping": "var(--border)", "comment": "brand — default divider on cool canvas", "utility": { "bg": "bg-border", "text": "text-border", "border": "border-border", "ring": "ring-border", "raw": "text-(--color-border)", "slug": "border" } }, { "name": "--color-border-focus", "aliasOf": "--border-focus", "family": "color", "tier": "brand", "lightValue": "oklch(0.17 0.006 50)", "darkValue": null, "rawLight": "var(--ring)", "rawDark": null, "themeMapping": "var(--border-focus)", "comment": "brand alias of --ring", "utility": { "bg": "bg-border-focus", "text": "text-border-focus", "border": "border-border-focus", "ring": "ring-border-focus", "raw": "text-(--color-border-focus)", "slug": "border-focus" } }, { "name": "--color-border-input", "aliasOf": "--border-input", "family": "color", "tier": "brand", "lightValue": "oklch(0.84 0.006 95)", "darkValue": "oklch(1 0 0 / 13%)", "rawLight": "oklch(0.84 0.006 95)", "rawDark": "oklch(1 0 0 / 13%)", "themeMapping": "var(--border-input)", "comment": "brand — input edge, sits between default and strong so empty fields read clearly", "utility": { "bg": "bg-border-input", "text": "text-border-input", "border": "border-border-input", "ring": "ring-border-input", "raw": "text-(--color-border-input)", "slug": "border-input" } }, { "name": "--color-border-strong", "aliasOf": "--border-strong", "family": "color", "tier": "brand", "lightValue": "oklch(0.78 0.006 95)", "darkValue": "oklch(1 0 0 / 18%)", "rawLight": "oklch(0.78 0.006 95)", "rawDark": "oklch(1 0 0 / 18%)", "themeMapping": "var(--border-strong)", "comment": "brand — assertive dividers", "utility": { "bg": "bg-border-strong", "text": "text-border-strong", "border": "border-border-strong", "ring": "ring-border-strong", "raw": "text-(--color-border-strong)", "slug": "border-strong" } }, { "name": "--color-border-subtle", "aliasOf": "--border-subtle", "family": "color", "tier": "brand", "lightValue": "oklch(0.94 0.004 95)", "darkValue": "oklch(1 0 0 / 6%)", "rawLight": "oklch(0.94 0.004 95)", "rawDark": "oklch(1 0 0 / 6%)", "themeMapping": "var(--border-subtle)", "comment": "brand — table rows, dense lists", "utility": { "bg": "bg-border-subtle", "text": "text-border-subtle", "border": "border-border-subtle", "ring": "ring-border-subtle", "raw": "text-(--color-border-subtle)", "slug": "border-subtle" } }, { "name": "--color-card", "aliasOf": "--card", "family": "color", "tier": "brand", "lightValue": "oklch(0.99 0.002 95)", "darkValue": "oklch(0.21 0.007 50)", "rawLight": "oklch(0.99 0.002 95)", "rawDark": "oklch(0.21 0.007 50)", "themeMapping": "var(--card)", "comment": "brand — near-white with subtle warm tint, sits flush with the white canvas", "utility": { "bg": "bg-card", "text": "text-card", "border": "border-card", "ring": "ring-card", "raw": "text-(--color-card)", "slug": "card" } }, { "name": "--color-card-foreground", "aliasOf": "--card-foreground", "family": "color", "tier": "brand", "lightValue": "oklch(0.17 0.006 50)", "darkValue": "oklch(0.99 0.002 95)", "rawLight": "oklch(0.17 0.006 50)", "rawDark": "oklch(0.99 0.002 95)", "themeMapping": "var(--card-foreground)", "comment": "brand — pairs with --card", "utility": { "bg": "bg-card-foreground", "text": "text-card-foreground", "border": "border-card-foreground", "ring": "ring-card-foreground", "raw": "text-(--color-card-foreground)", "slug": "card-foreground" } }, { "name": "--color-chart-1", "aliasOf": "--chart-1", "family": "color", "tier": "brand", "lightValue": "oklch(0.85 0.18 100)", "darkValue": "oklch(0.92 0.18 100)", "rawLight": "oklch(0.85 0.18 100)", "rawDark": "oklch(0.92 0.18 100)", "themeMapping": "var(--chart-1)", "comment": "brand — yellow (anchors to brand accent)", "utility": { "bg": "bg-chart-1", "text": "text-chart-1", "border": "border-chart-1", "ring": "ring-chart-1", "raw": "text-(--color-chart-1)", "slug": "chart-1" } }, { "name": "--color-chart-10", "aliasOf": "--chart-10", "family": "color", "tier": "brand", "lightValue": "oklch(0.55 0.14 35)", "darkValue": "oklch(0.6 0.14 35)", "rawLight": "oklch(0.55 0.14 35)", "rawDark": "oklch(0.6 0.14 35)", "themeMapping": "var(--chart-10)", "comment": "brand — rust", "utility": { "bg": "bg-chart-10", "text": "text-chart-10", "border": "border-chart-10", "ring": "ring-chart-10", "raw": "text-(--color-chart-10)", "slug": "chart-10" } }, { "name": "--color-chart-11", "aliasOf": "--chart-11", "family": "color", "tier": "brand", "lightValue": "oklch(0.7 0.1 220)", "darkValue": "oklch(0.75 0.1 220)", "rawLight": "oklch(0.7 0.1 220)", "rawDark": "oklch(0.75 0.1 220)", "themeMapping": "var(--chart-11)", "comment": "brand — sky", "utility": { "bg": "bg-chart-11", "text": "text-chart-11", "border": "border-chart-11", "ring": "ring-chart-11", "raw": "text-(--color-chart-11)", "slug": "chart-11" } }, { "name": "--color-chart-12", "aliasOf": "--chart-12", "family": "color", "tier": "brand", "lightValue": "oklch(0.65 0.09 5)", "darkValue": "oklch(0.7 0.09 5)", "rawLight": "oklch(0.65 0.09 5)", "rawDark": "oklch(0.7 0.09 5)", "themeMapping": "var(--chart-12)", "comment": "brand — dusty rose", "utility": { "bg": "bg-chart-12", "text": "text-chart-12", "border": "border-chart-12", "ring": "ring-chart-12", "raw": "text-(--color-chart-12)", "slug": "chart-12" } }, { "name": "--color-chart-2", "aliasOf": "--chart-2", "family": "color", "tier": "brand", "lightValue": "oklch(0.65 0.13 195)", "darkValue": "oklch(0.7 0.13 195)", "rawLight": "oklch(0.65 0.13 195)", "rawDark": "oklch(0.7 0.13 195)", "themeMapping": "var(--chart-2)", "comment": "brand — teal", "utility": { "bg": "bg-chart-2", "text": "text-chart-2", "border": "border-chart-2", "ring": "ring-chart-2", "raw": "text-(--color-chart-2)", "slug": "chart-2" } }, { "name": "--color-chart-3", "aliasOf": "--chart-3", "family": "color", "tier": "brand", "lightValue": "oklch(0.7 0.15 50)", "darkValue": "oklch(0.75 0.15 50)", "rawLight": "oklch(0.7 0.15 50)", "rawDark": "oklch(0.75 0.15 50)", "themeMapping": "var(--chart-3)", "comment": "brand — orange", "utility": { "bg": "bg-chart-3", "text": "text-chart-3", "border": "border-chart-3", "ring": "ring-chart-3", "raw": "text-(--color-chart-3)", "slug": "chart-3" } }, { "name": "--color-chart-4", "aliasOf": "--chart-4", "family": "color", "tier": "brand", "lightValue": "oklch(0.65 0.13 140)", "darkValue": "oklch(0.7 0.13 140)", "rawLight": "oklch(0.65 0.13 140)", "rawDark": "oklch(0.7 0.13 140)", "themeMapping": "var(--chart-4)", "comment": "brand — green", "utility": { "bg": "bg-chart-4", "text": "text-chart-4", "border": "border-chart-4", "ring": "ring-chart-4", "raw": "text-(--color-chart-4)", "slug": "chart-4" } }, { "name": "--color-chart-5", "aliasOf": "--chart-5", "family": "color", "tier": "brand", "lightValue": "oklch(0.7 0.13 15)", "darkValue": "oklch(0.75 0.13 15)", "rawLight": "oklch(0.7 0.13 15)", "rawDark": "oklch(0.75 0.13 15)", "themeMapping": "var(--chart-5)", "comment": "brand — coral", "utility": { "bg": "bg-chart-5", "text": "text-chart-5", "border": "border-chart-5", "ring": "ring-chart-5", "raw": "text-(--color-chart-5)", "slug": "chart-5" } }, { "name": "--color-chart-6", "aliasOf": "--chart-6", "family": "color", "tier": "brand", "lightValue": "oklch(0.6 0.16 250)", "darkValue": "oklch(0.65 0.16 250)", "rawLight": "oklch(0.6 0.16 250)", "rawDark": "oklch(0.65 0.16 250)", "themeMapping": "var(--chart-6)", "comment": "brand — blue", "utility": { "bg": "bg-chart-6", "text": "text-chart-6", "border": "border-chart-6", "ring": "ring-chart-6", "raw": "text-(--color-chart-6)", "slug": "chart-6" } }, { "name": "--color-chart-7", "aliasOf": "--chart-7", "family": "color", "tier": "brand", "lightValue": "oklch(0.65 0.13 290)", "darkValue": "oklch(0.7 0.13 290)", "rawLight": "oklch(0.65 0.13 290)", "rawDark": "oklch(0.7 0.13 290)", "themeMapping": "var(--chart-7)", "comment": "brand — lavender", "utility": { "bg": "bg-chart-7", "text": "text-chart-7", "border": "border-chart-7", "ring": "ring-chart-7", "raw": "text-(--color-chart-7)", "slug": "chart-7" } }, { "name": "--color-chart-8", "aliasOf": "--chart-8", "family": "color", "tier": "brand", "lightValue": "oklch(0.55 0.18 330)", "darkValue": "oklch(0.6 0.18 330)", "rawLight": "oklch(0.55 0.18 330)", "rawDark": "oklch(0.6 0.18 330)", "themeMapping": "var(--chart-8)", "comment": "brand — magenta", "utility": { "bg": "bg-chart-8", "text": "text-chart-8", "border": "border-chart-8", "ring": "ring-chart-8", "raw": "text-(--color-chart-8)", "slug": "chart-8" } }, { "name": "--color-chart-9", "aliasOf": "--chart-9", "family": "color", "tier": "brand", "lightValue": "oklch(0.5 0.13 155)", "darkValue": "oklch(0.55 0.13 155)", "rawLight": "oklch(0.5 0.13 155)", "rawDark": "oklch(0.55 0.13 155)", "themeMapping": "var(--chart-9)", "comment": "brand — forest", "utility": { "bg": "bg-chart-9", "text": "text-chart-9", "border": "border-chart-9", "ring": "ring-chart-9", "raw": "text-(--color-chart-9)", "slug": "chart-9" } }, { "name": "--color-chart-axis", "aliasOf": "--chart-axis", "family": "color", "tier": "brand", "lightValue": "oklch(0.78 0.006 95)", "darkValue": null, "rawLight": "var(--border-strong)", "rawDark": null, "themeMapping": "var(--chart-axis)", "comment": "brand", "utility": { "bg": "bg-chart-axis", "text": "text-chart-axis", "border": "border-chart-axis", "ring": "ring-chart-axis", "raw": "text-(--color-chart-axis)", "slug": "chart-axis" } }, { "name": "--color-chart-grid", "aliasOf": "--chart-grid", "family": "color", "tier": "brand", "lightValue": "oklch(0.94 0.004 95)", "darkValue": null, "rawLight": "var(--border-subtle)", "rawDark": null, "themeMapping": "var(--chart-grid)", "comment": "brand", "utility": { "bg": "bg-chart-grid", "text": "text-chart-grid", "border": "border-chart-grid", "ring": "ring-chart-grid", "raw": "text-(--color-chart-grid)", "slug": "chart-grid" } }, { "name": "--color-chart-tooltip-bg", "aliasOf": "--chart-tooltip-bg", "family": "color", "tier": "brand", "lightValue": "oklch(0.99 0.002 95)", "darkValue": null, "rawLight": "var(--popover)", "rawDark": null, "themeMapping": "var(--chart-tooltip-bg)", "comment": "brand", "utility": { "bg": "bg-chart-tooltip-bg", "text": "text-chart-tooltip-bg", "border": "border-chart-tooltip-bg", "ring": "ring-chart-tooltip-bg", "raw": "text-(--color-chart-tooltip-bg)", "slug": "chart-tooltip-bg" } }, { "name": "--color-chart-tooltip-fg", "aliasOf": "--chart-tooltip-fg", "family": "color", "tier": "brand", "lightValue": "oklch(0.17 0.006 50)", "darkValue": null, "rawLight": "var(--popover-foreground)", "rawDark": null, "themeMapping": "var(--chart-tooltip-fg)", "comment": "brand", "utility": { "bg": "bg-chart-tooltip-fg", "text": "text-chart-tooltip-fg", "border": "border-chart-tooltip-fg", "ring": "ring-chart-tooltip-fg", "raw": "text-(--color-chart-tooltip-fg)", "slug": "chart-tooltip-fg" } }, { "name": "--color-foreground", "aliasOf": "--foreground", "family": "color", "tier": "brand", "lightValue": "oklch(0.17 0.006 50)", "darkValue": "oklch(0.99 0.002 95)", "rawLight": "oklch(0.17 0.006 50)", "rawDark": "oklch(0.99 0.002 95)", "themeMapping": "var(--foreground)", "comment": "brand — warm near-black body text (#110F0D)", "utility": { "bg": "bg-foreground", "text": "text-foreground", "border": "border-foreground", "ring": "ring-foreground", "raw": "text-(--color-foreground)", "slug": "foreground" } }, { "name": "--color-foreground-disabled", "aliasOf": "--foreground-disabled", "family": "color", "tier": "brand", "lightValue": "oklch(0.63 0.01 100.08)", "darkValue": "oklch(0.5 0.008 50)", "rawLight": "oklch(0.63 0.01 100.08)", "rawDark": "oklch(0.5 0.008 50)", "themeMapping": "var(--foreground-disabled)", "comment": "brand — disabled controls (warm mid-grey, low-chroma yellow tint)", "utility": { "bg": "bg-foreground-disabled", "text": "text-foreground-disabled", "border": "border-foreground-disabled", "ring": "ring-foreground-disabled", "raw": "text-(--color-foreground-disabled)", "slug": "foreground-disabled" } }, { "name": "--color-foreground-subtle", "aliasOf": "--foreground-subtle", "family": "color", "tier": "brand", "lightValue": "oklch(0.35 0.01 100.33)", "darkValue": "oklch(0.7 0.008 50)", "rawLight": "oklch(0.35 0.01 100.33)", "rawDark": "oklch(0.7 0.008 50)", "themeMapping": "var(--foreground-subtle)", "comment": "brand — captions, secondary labels (warm grey, low-chroma yellow tint)", "utility": { "bg": "bg-foreground-subtle", "text": "text-foreground-subtle", "border": "border-foreground-subtle", "ring": "ring-foreground-subtle", "raw": "text-(--color-foreground-subtle)", "slug": "foreground-subtle" } }, { "name": "--color-input", "aliasOf": "--input", "family": "color", "tier": "brand", "lightValue": "oklch(0.97 0.004 95)", "darkValue": "oklch(1 0 0 / 8%)", "rawLight": "oklch(0.97 0.004 95)", "rawDark": "oklch(1 0 0 / 8%)", "themeMapping": "var(--input)", "comment": "brand — input fill", "utility": { "bg": "bg-input", "text": "text-input", "border": "border-input", "ring": "ring-input", "raw": "text-(--color-input)", "slug": "input" } }, { "name": "--color-muted", "aliasOf": "--muted", "family": "color", "tier": "brand", "lightValue": "oklch(0.96 0.004 95)", "darkValue": "oklch(0.25 0.007 50)", "rawLight": "oklch(0.96 0.004 95)", "rawDark": "oklch(0.25 0.007 50)", "themeMapping": "var(--muted)", "comment": "brand — depressed surface (alt sections)", "utility": { "bg": "bg-muted", "text": "text-muted", "border": "border-muted", "ring": "ring-muted", "raw": "text-(--color-muted)", "slug": "muted" } }, { "name": "--color-popover", "aliasOf": "--popover", "family": "color", "tier": "brand", "lightValue": "oklch(0.99 0.002 95)", "darkValue": "oklch(0.21 0.007 50)", "rawLight": "oklch(0.99 0.002 95)", "rawDark": "oklch(0.21 0.007 50)", "themeMapping": "var(--popover)", "comment": "brand — pairs with --card", "utility": { "bg": "bg-popover", "text": "text-popover", "border": "border-popover", "ring": "ring-popover", "raw": "text-(--color-popover)", "slug": "popover" } }, { "name": "--color-popover-foreground", "aliasOf": "--popover-foreground", "family": "color", "tier": "brand", "lightValue": "oklch(0.17 0.006 50)", "darkValue": "oklch(0.99 0.002 95)", "rawLight": "oklch(0.17 0.006 50)", "rawDark": "oklch(0.99 0.002 95)", "themeMapping": "var(--popover-foreground)", "comment": "brand — pairs with --popover", "utility": { "bg": "bg-popover-foreground", "text": "text-popover-foreground", "border": "border-popover-foreground", "ring": "ring-popover-foreground", "raw": "text-(--color-popover-foreground)", "slug": "popover-foreground" } }, { "name": "--color-primary", "aliasOf": "--primary", "family": "color", "tier": "brand", "lightValue": "oklch(0.17 0.006 50)", "darkValue": "oklch(0.99 0.002 95)", "rawLight": "oklch(0.17 0.006 50)", "rawDark": "oklch(0.99 0.002 95)", "themeMapping": "var(--primary)", "comment": "brand — warm near-black, the marketing CTA color", "utility": { "bg": "bg-primary", "text": "text-primary", "border": "border-primary", "ring": "ring-primary", "raw": "text-(--color-primary)", "slug": "primary" } }, { "name": "--color-primary-foreground", "aliasOf": "--primary-foreground", "family": "color", "tier": "brand", "lightValue": "oklch(0.99 0.002 95)", "darkValue": "oklch(0.17 0.006 50)", "rawLight": "oklch(0.99 0.002 95)", "rawDark": "oklch(0.17 0.006 50)", "themeMapping": "var(--primary-foreground)", "comment": "brand — near-white on near-black", "utility": { "bg": "bg-primary-foreground", "text": "text-primary-foreground", "border": "border-primary-foreground", "ring": "ring-primary-foreground", "raw": "text-(--color-primary-foreground)", "slug": "primary-foreground" } }, { "name": "--color-ring", "aliasOf": "--ring", "family": "color", "tier": "brand", "lightValue": "oklch(0.17 0.006 50)", "darkValue": "oklch(0.85 0.16 100)", "rawLight": "oklch(0.17 0.006 50)", "rawDark": "oklch(0.85 0.16 100)", "themeMapping": "var(--ring)", "comment": "brand — focus ring color (uses --primary hue for crisp visibility)", "utility": { "bg": "bg-ring", "text": "text-ring", "border": "border-ring", "ring": "ring-ring", "raw": "text-(--color-ring)", "slug": "ring" } }, { "name": "--color-secondary", "aliasOf": "--secondary", "family": "color", "tier": "brand", "lightValue": "oklch(0.97 0.004 95)", "darkValue": "oklch(0.3 0.007 50)", "rawLight": "oklch(0.97 0.004 95)", "rawDark": "oklch(0.3 0.007 50)", "themeMapping": "var(--secondary)", "comment": "brand — quiet neutral for secondary buttons / soft badges", "utility": { "bg": "bg-secondary", "text": "text-secondary", "border": "border-secondary", "ring": "ring-secondary", "raw": "text-(--color-secondary)", "slug": "secondary" } }, { "name": "--color-secondary-foreground", "aliasOf": "--secondary-foreground", "family": "color", "tier": "brand", "lightValue": "oklch(0.17 0.006 50)", "darkValue": "oklch(0.99 0.002 95)", "rawLight": "oklch(0.17 0.006 50)", "rawDark": "oklch(0.99 0.002 95)", "themeMapping": "var(--secondary-foreground)", "comment": "brand", "utility": { "bg": "bg-secondary-foreground", "text": "text-secondary-foreground", "border": "border-secondary-foreground", "ring": "ring-secondary-foreground", "raw": "text-(--color-secondary-foreground)", "slug": "secondary-foreground" } }, { "name": "--color-sidebar", "aliasOf": "--sidebar", "family": "color", "tier": "brand", "lightValue": "oklch(0.99 0.002 95)", "darkValue": "oklch(0.21 0.007 50)", "rawLight": "oklch(0.99 0.002 95)", "rawDark": "oklch(0.21 0.007 50)", "themeMapping": "var(--sidebar)", "comment": "brand — near-white sidebar surface", "utility": { "bg": "bg-sidebar", "text": "text-sidebar", "border": "border-sidebar", "ring": "ring-sidebar", "raw": "text-(--color-sidebar)", "slug": "sidebar" } }, { "name": "--color-sidebar-accent", "aliasOf": "--sidebar-accent", "family": "color", "tier": "brand", "lightValue": "oklch(0.96 0.004 95)", "darkValue": "oklch(0.27 0.007 50)", "rawLight": "oklch(0.96 0.004 95)", "rawDark": "oklch(0.27 0.007 50)", "themeMapping": "var(--sidebar-accent)", "comment": "brand — hover/selected item surface (subtle, not yellow, to avoid loud nav)", "utility": { "bg": "bg-sidebar-accent", "text": "text-sidebar-accent", "border": "border-sidebar-accent", "ring": "ring-sidebar-accent", "raw": "text-(--color-sidebar-accent)", "slug": "sidebar-accent" } }, { "name": "--color-sidebar-accent-foreground", "aliasOf": "--sidebar-accent-foreground", "family": "color", "tier": "brand", "lightValue": "oklch(0.17 0.006 50)", "darkValue": "oklch(0.99 0.002 95)", "rawLight": "oklch(0.17 0.006 50)", "rawDark": "oklch(0.99 0.002 95)", "themeMapping": "var(--sidebar-accent-foreground)", "comment": "brand", "utility": { "bg": "bg-sidebar-accent-foreground", "text": "text-sidebar-accent-foreground", "border": "border-sidebar-accent-foreground", "ring": "ring-sidebar-accent-foreground", "raw": "text-(--color-sidebar-accent-foreground)", "slug": "sidebar-accent-foreground" } }, { "name": "--color-sidebar-border", "aliasOf": "--sidebar-border", "family": "color", "tier": "brand", "lightValue": "oklch(0.9 0.005 95)", "darkValue": "oklch(1 0 0 / 10%)", "rawLight": "oklch(0.9 0.005 95)", "rawDark": "oklch(1 0 0 / 10%)", "themeMapping": "var(--sidebar-border)", "comment": "brand — visible against sidebar surface", "utility": { "bg": "bg-sidebar-border", "text": "text-sidebar-border", "border": "border-sidebar-border", "ring": "ring-sidebar-border", "raw": "text-(--color-sidebar-border)", "slug": "sidebar-border" } }, { "name": "--color-sidebar-foreground", "aliasOf": "--sidebar-foreground", "family": "color", "tier": "brand", "lightValue": "oklch(0.17 0.006 50)", "darkValue": "oklch(0.99 0.002 95)", "rawLight": "oklch(0.17 0.006 50)", "rawDark": "oklch(0.99 0.002 95)", "themeMapping": "var(--sidebar-foreground)", "comment": "brand", "utility": { "bg": "bg-sidebar-foreground", "text": "text-sidebar-foreground", "border": "border-sidebar-foreground", "ring": "ring-sidebar-foreground", "raw": "text-(--color-sidebar-foreground)", "slug": "sidebar-foreground" } }, { "name": "--color-sidebar-primary", "aliasOf": "--sidebar-primary", "family": "color", "tier": "brand", "lightValue": "oklch(0.17 0.006 50)", "darkValue": "oklch(0.99 0.002 95)", "rawLight": "oklch(0.17 0.006 50)", "rawDark": "oklch(0.99 0.002 95)", "themeMapping": "var(--sidebar-primary)", "comment": "brand", "utility": { "bg": "bg-sidebar-primary", "text": "text-sidebar-primary", "border": "border-sidebar-primary", "ring": "ring-sidebar-primary", "raw": "text-(--color-sidebar-primary)", "slug": "sidebar-primary" } }, { "name": "--color-sidebar-primary-foreground", "aliasOf": "--sidebar-primary-foreground", "family": "color", "tier": "brand", "lightValue": "oklch(0.99 0.002 95)", "darkValue": "oklch(0.17 0.006 50)", "rawLight": "oklch(0.99 0.002 95)", "rawDark": "oklch(0.17 0.006 50)", "themeMapping": "var(--sidebar-primary-foreground)", "comment": "brand", "utility": { "bg": "bg-sidebar-primary-foreground", "text": "text-sidebar-primary-foreground", "border": "border-sidebar-primary-foreground", "ring": "ring-sidebar-primary-foreground", "raw": "text-(--color-sidebar-primary-foreground)", "slug": "sidebar-primary-foreground" } }, { "name": "--color-sidebar-ring", "aliasOf": "--sidebar-ring", "family": "color", "tier": "brand", "lightValue": "oklch(0.17 0.006 50)", "darkValue": "oklch(0.85 0.16 100)", "rawLight": "oklch(0.17 0.006 50)", "rawDark": "oklch(0.85 0.16 100)", "themeMapping": "var(--sidebar-ring)", "comment": "brand", "utility": { "bg": "bg-sidebar-ring", "text": "text-sidebar-ring", "border": "border-sidebar-ring", "ring": "ring-sidebar-ring", "raw": "text-(--color-sidebar-ring)", "slug": "sidebar-ring" } }, { "name": "--color-tier-exclusive", "aliasOf": "--tier-exclusive", "family": "color", "tier": "brand", "lightValue": "oklch(0.19 0.006 50)", "darkValue": "oklch(0.99 0.002 95)", "rawLight": "oklch(0.19 0.006 50)", "rawDark": "oklch(0.99 0.002 95)", "themeMapping": "var(--tier-exclusive)", "comment": "brand — warm near-black card", "utility": { "bg": "bg-tier-exclusive", "text": "text-tier-exclusive", "border": "border-tier-exclusive", "ring": "ring-tier-exclusive", "raw": "text-(--color-tier-exclusive)", "slug": "tier-exclusive" } }, { "name": "--color-tier-exclusive-foreground", "aliasOf": "--tier-exclusive-foreground", "family": "color", "tier": "brand", "lightValue": "oklch(0.99 0.002 95)", "darkValue": "oklch(0.17 0.006 50)", "rawLight": "oklch(0.99 0.002 95)", "rawDark": "oklch(0.17 0.006 50)", "themeMapping": "var(--tier-exclusive-foreground)", "comment": "brand — near-white text", "utility": { "bg": "bg-tier-exclusive-foreground", "text": "text-tier-exclusive-foreground", "border": "border-tier-exclusive-foreground", "ring": "ring-tier-exclusive-foreground", "raw": "text-(--color-tier-exclusive-foreground)", "slug": "tier-exclusive-foreground" } }, { "name": "--color-tier-free", "aliasOf": "--tier-free", "family": "color", "tier": "brand", "lightValue": "oklch(0.99 0.002 95)", "darkValue": "oklch(0.21 0.007 50)", "rawLight": "oklch(0.99 0.002 95)", "rawDark": "oklch(0.21 0.007 50)", "themeMapping": "var(--tier-free)", "comment": "brand — near-white card", "utility": { "bg": "bg-tier-free", "text": "text-tier-free", "border": "border-tier-free", "ring": "ring-tier-free", "raw": "text-(--color-tier-free)", "slug": "tier-free" } }, { "name": "--color-tier-free-foreground", "aliasOf": "--tier-free-foreground", "family": "color", "tier": "brand", "lightValue": "oklch(0.17 0.006 50)", "darkValue": "oklch(0.99 0.002 95)", "rawLight": "oklch(0.17 0.006 50)", "rawDark": "oklch(0.99 0.002 95)", "themeMapping": "var(--tier-free-foreground)", "comment": "brand — warm near-black", "utility": { "bg": "bg-tier-free-foreground", "text": "text-tier-free-foreground", "border": "border-tier-free-foreground", "ring": "ring-tier-free-foreground", "raw": "text-(--color-tier-free-foreground)", "slug": "tier-free-foreground" } }, { "name": "--color-tier-premium", "aliasOf": "--tier-premium", "family": "color", "tier": "brand", "lightValue": "oklch(0.945 0.18 100)", "darkValue": "oklch(0.85 0.16 100)", "rawLight": "oklch(0.945 0.18 100)", "rawDark": "oklch(0.85 0.16 100)", "themeMapping": "var(--tier-premium)", "comment": "brand — bright yellow (mirrors --accent)", "utility": { "bg": "bg-tier-premium", "text": "text-tier-premium", "border": "border-tier-premium", "ring": "ring-tier-premium", "raw": "text-(--color-tier-premium)", "slug": "tier-premium" } }, { "name": "--color-tier-premium-foreground", "aliasOf": "--tier-premium-foreground", "family": "color", "tier": "brand", "lightValue": "oklch(0.18 0.025 90)", "darkValue": "oklch(0.18 0.025 90)", "rawLight": "oklch(0.18 0.025 90)", "rawDark": "oklch(0.18 0.025 90)", "themeMapping": "var(--tier-premium-foreground)", "comment": "brand — dark warm ink on yellow", "utility": { "bg": "bg-tier-premium-foreground", "text": "text-tier-premium-foreground", "border": "border-tier-premium-foreground", "ring": "ring-tier-premium-foreground", "raw": "text-(--color-tier-premium-foreground)", "slug": "tier-premium-foreground" } }, { "name": "--color-warning", "aliasOf": "--warning", "family": "color", "tier": "brand", "lightValue": "oklch(0.93 0.06 60)", "darkValue": "oklch(0.32 0.08 60)", "rawLight": "oklch(0.93 0.06 60)", "rawDark": "oklch(0.32 0.08 60)", "themeMapping": "var(--warning)", "comment": "shifted from 80→60 to clear the brand yellow (hue 100); L/C tunable", "utility": { "bg": "bg-warning", "text": "text-warning", "border": "border-warning", "ring": "ring-warning", "raw": "text-(--color-warning)", "slug": "warning" } }, { "name": "--gradient-brand", "aliasOf": null, "family": "color", "tier": "brand", "lightValue": "linear-gradient(135deg, var(--primary), var(--accent))", "darkValue": null, "rawLight": "linear-gradient(135deg, var(--primary), var(--accent))", "rawDark": null, "themeMapping": null, "comment": "brand — black → yellow, the marketing signature", "utility": {} }, { "name": "--slider-range", "aliasOf": null, "family": "color", "tier": "brand", "lightValue": "oklch(0.17 0.006 50)", "darkValue": "oklch(0.85 0.16 100)", "rawLight": "var(--primary)", "rawDark": "var(--accent)", "themeMapping": null, "comment": "tunable — defaults to brand primary", "utility": {} }, { "name": "--switch-track-on", "aliasOf": null, "family": "color", "tier": "brand", "lightValue": "oklch(0.17 0.006 50)", "darkValue": "oklch(0.85 0.16 100)", "rawLight": "var(--primary)", "rawDark": "var(--accent)", "themeMapping": null, "comment": "tunable — defaults to brand primary", "utility": {} }, { "name": "--code-bg", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "oklch(0.96 0.004 95)", "darkValue": null, "rawLight": "var(--muted)", "rawDark": null, "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--code-fg", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "oklch(0.17 0.006 50)", "darkValue": null, "rawLight": "var(--foreground)", "rawDark": null, "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--color-muted-foreground", "aliasOf": "--muted-foreground", "family": "color", "tier": "tunable", "lightValue": "oklch(0.51 0.01 95.31)", "darkValue": "oklch(0.62 0.008 50)", "rawLight": "oklch(0.51 0.01 95.31)", "rawDark": "oklch(0.62 0.008 50)", "themeMapping": "var(--muted-foreground)", "comment": "tunable — sits between -subtle and -disabled", "utility": { "bg": "bg-muted-foreground", "text": "text-muted-foreground", "border": "border-muted-foreground", "ring": "ring-muted-foreground", "raw": "text-(--color-muted-foreground)", "slug": "muted-foreground" } }, { "name": "--color-overlay", "aliasOf": "--overlay", "family": "color", "tier": "tunable", "lightValue": "color-mix(in oklch, oklch(0 0 0) 30%, transparent)", "darkValue": null, "rawLight": "color-mix(in oklch, oklch(0 0 0) 30%, transparent)", "rawDark": null, "themeMapping": "var(--overlay)", "comment": "tunable", "utility": { "bg": "bg-overlay", "text": "text-overlay", "border": "border-overlay", "ring": "ring-overlay", "raw": "text-(--color-overlay)", "slug": "overlay" } }, { "name": "--color-warning-foreground", "aliasOf": "--warning-foreground", "family": "color", "tier": "tunable", "lightValue": "oklch(0.5 0.14 55)", "darkValue": "oklch(0.88 0.14 55)", "rawLight": "oklch(0.5 0.14 55)", "rawDark": "oklch(0.88 0.14 55)", "themeMapping": "var(--warning-foreground)", "comment": "hue ~55 = deeper orange tone; L/C tunable", "utility": { "bg": "bg-warning-foreground", "text": "text-warning-foreground", "border": "border-warning-foreground", "ring": "ring-warning-foreground", "raw": "text-(--color-warning-foreground)", "slug": "warning-foreground" } }, { "name": "--kbd-bg", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "oklch(0.96 0.004 95)", "darkValue": null, "rawLight": "var(--muted)", "rawDark": null, "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--kbd-border", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "oklch(0.78 0.006 95)", "darkValue": null, "rawLight": "var(--border-strong)", "rawDark": null, "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--kbd-fg", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "oklch(0.17 0.006 50)", "darkValue": null, "rawLight": "var(--foreground)", "rawDark": null, "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--label-color", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "oklch(0.17 0.006 50)", "darkValue": null, "rawLight": "var(--foreground)", "rawDark": null, "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--link", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "oklch(0.17 0.006 50)", "darkValue": "oklch(0.85 0.16 100)", "rawLight": "var(--primary)", "rawDark": "var(--accent)", "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--link-hover", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "oklch(0.17 0.006 50)", "darkValue": "oklch(0.99 0.002 95)", "rawLight": "oklch(0.17 0.006 50)", "rawDark": "oklch(0.99 0.002 95)", "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--link-visited", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "oklch(0.34 0.008 50)", "darkValue": "oklch(0.7 0.008 50)", "rawLight": "oklch(0.34 0.008 50)", "rawDark": "oklch(0.7 0.008 50)", "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--placeholder-color", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "oklch(0.63 0.01 100.08)", "darkValue": null, "rawLight": "var(--foreground-disabled)", "rawDark": null, "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--required-indicator-color", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "oklch(0.5 0.2 27.325)", "darkValue": null, "rawLight": "var(--destructive-foreground)", "rawDark": null, "themeMapping": null, "comment": "tunable — asterisk color in ", "utility": {} }, { "name": "--scrollbar-thumb", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "color-mix(in oklch, var(--foreground) 20%, transparent)", "darkValue": "color-mix(in oklch, var(--foreground) 30%, transparent)", "rawLight": "color-mix(in oklch, var(--foreground) 20%, transparent)", "rawDark": "color-mix(in oklch, var(--foreground) 30%, transparent)", "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--scrollbar-track", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "transparent", "darkValue": null, "rawLight": "transparent", "rawDark": null, "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--selection-bg", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "oklch(0.945 0.18 100)", "darkValue": "oklch(0.85 0.16 100)", "rawLight": "var(--accent)", "rawDark": "var(--accent)", "themeMapping": null, "comment": "tunable — yellow selection mirrors marketing ::selection", "utility": {} }, { "name": "--selection-fg", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "oklch(0.18 0.025 90)", "darkValue": "oklch(0.18 0.025 90)", "rawLight": "var(--accent-foreground)", "rawDark": "var(--accent-foreground)", "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--skeleton-bg", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "color-mix(in oklch, var(--muted) 80%, var(--background))", "darkValue": null, "rawLight": "color-mix(in oklch, var(--muted) 80%, var(--background))", "rawDark": null, "themeMapping": null, "comment": "tunable — cool-neutral base", "utility": {} }, { "name": "--skeleton-shimmer", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "color-mix(in oklch, var(--foreground) 6%, transparent)", "darkValue": null, "rawLight": "color-mix(in oklch, var(--foreground) 6%, transparent)", "rawDark": null, "themeMapping": null, "comment": "tunable — foreground-tinted shimmer band", "utility": {} }, { "name": "--slider-thumb", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "oklch(0.99 0.002 95)", "darkValue": "oklch(0.99 0.002 95)", "rawLight": "oklch(0.99 0.002 95)", "rawDark": "oklch(0.99 0.002 95)", "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--slider-track", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "oklch(0.88 0.005 95)", "darkValue": "oklch(1 0 0 / 0.18)", "rawLight": "oklch(0.88 0.005 95)", "rawDark": "oklch(1 0 0 / 0.18)", "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--switch-thumb", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "oklch(0.99 0.002 95)", "darkValue": "oklch(0.21 0.007 50)", "rawLight": "oklch(0.99 0.002 95)", "rawDark": "oklch(0.21 0.007 50)", "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--switch-track-off", "aliasOf": null, "family": "color", "tier": "tunable", "lightValue": "oklch(0.88 0.005 95)", "darkValue": "oklch(1 0 0 / 0.18)", "rawLight": "oklch(0.88 0.005 95)", "rawDark": "oklch(1 0 0 / 0.18)", "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--density-card-padding", "aliasOf": null, "family": "density", "tier": "locked", "lightValue": "1.5rem", "darkValue": null, "rawLight": "1.5rem", "rawDark": null, "themeMapping": null, "comment": "locked", "utility": {} }, { "name": "--density-control-h", "aliasOf": null, "family": "density", "tier": "locked", "lightValue": "2.25rem", "darkValue": null, "rawLight": "var(--size-control-md)", "rawDark": null, "themeMapping": null, "comment": "locked", "utility": {} }, { "name": "--density-field-gap", "aliasOf": null, "family": "density", "tier": "locked", "lightValue": "0.5rem", "darkValue": null, "rawLight": "0.5rem", "rawDark": null, "themeMapping": null, "comment": "locked", "utility": {} }, { "name": "--ring-offset", "aliasOf": null, "family": "focus-ring", "tier": "locked", "lightValue": "2px", "darkValue": null, "rawLight": "2px", "rawDark": null, "themeMapping": null, "comment": "locked", "utility": {} }, { "name": "--ring-width", "aliasOf": null, "family": "focus-ring", "tier": "locked", "lightValue": "3px", "darkValue": null, "rawLight": "3px", "rawDark": null, "themeMapping": null, "comment": "locked — single canonical width", "utility": {} }, { "name": "--font-display", "aliasOf": "--font-cabinet-grotesk", "family": "font", "tier": "tunable", "lightValue": "var(--font-cabinet-grotesk)", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "var(--font-cabinet-grotesk)", "comment": "", "utility": { "font": "font-display", "slug": "display" } }, { "name": "--font-heading", "aliasOf": "--font-cabinet-grotesk", "family": "font", "tier": "tunable", "lightValue": "var(--font-cabinet-grotesk)", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "var(--font-cabinet-grotesk)", "comment": "", "utility": { "font": "font-heading", "slug": "heading" } }, { "name": "--font-mono", "aliasOf": "--font-jetbrains-mono", "family": "font", "tier": "tunable", "lightValue": "var(--font-jetbrains-mono)", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "var(--font-jetbrains-mono)", "comment": "", "utility": { "font": "font-mono", "slug": "mono" } }, { "name": "--font-sans", "aliasOf": "--font-general-sans", "family": "font", "tier": "tunable", "lightValue": "var(--font-general-sans)", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "var(--font-general-sans)", "comment": "", "utility": { "font": "font-sans", "slug": "sans" } }, { "name": "--field-gap", "aliasOf": null, "family": "form", "tier": "tunable", "lightValue": "0.375rem", "darkValue": null, "rawLight": "0.375rem", "rawDark": null, "themeMapping": null, "comment": "tunable — label → input → description rhythm", "utility": {} }, { "name": "--field-padding-x", "aliasOf": null, "family": "form", "tier": "tunable", "lightValue": "0.75rem", "darkValue": null, "rawLight": "0.75rem", "rawDark": null, "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--container-content", "aliasOf": null, "family": "layout", "tier": "tunable", "lightValue": "42rem", "darkValue": null, "rawLight": "42rem", "rawDark": null, "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--container-dashboard", "aliasOf": null, "family": "layout", "tier": "tunable", "lightValue": "80rem", "darkValue": null, "rawLight": "80rem", "rawDark": null, "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--container-prose", "aliasOf": null, "family": "layout", "tier": "tunable", "lightValue": "65ch", "darkValue": null, "rawLight": "65ch", "rawDark": null, "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--container-wide", "aliasOf": null, "family": "layout", "tier": "tunable", "lightValue": "90rem", "darkValue": null, "rawLight": "90rem", "rawDark": null, "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--sidebar-width", "aliasOf": null, "family": "layout", "tier": "tunable", "lightValue": "16rem", "darkValue": null, "rawLight": "16rem", "rawDark": null, "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--sidebar-width-icon", "aliasOf": null, "family": "layout", "tier": "tunable", "lightValue": "3rem", "darkValue": null, "rawLight": "3rem", "rawDark": null, "themeMapping": null, "comment": "tunable", "utility": {} }, { "name": "--duration-fast", "aliasOf": null, "family": "motion", "tier": "tunable", "lightValue": "100ms", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "100ms", "comment": "tunable", "utility": { "duration": "duration-fast", "slug": "fast" } }, { "name": "--duration-instant", "aliasOf": null, "family": "motion", "tier": "tunable", "lightValue": "0ms", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "0ms", "comment": "tunable", "utility": { "duration": "duration-instant", "slug": "instant" } }, { "name": "--duration-normal", "aliasOf": null, "family": "motion", "tier": "tunable", "lightValue": "200ms", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "200ms", "comment": "tunable", "utility": { "duration": "duration-normal", "slug": "normal" } }, { "name": "--duration-slow", "aliasOf": null, "family": "motion", "tier": "tunable", "lightValue": "300ms", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "300ms", "comment": "tunable", "utility": { "duration": "duration-slow", "slug": "slow" } }, { "name": "--duration-slower", "aliasOf": null, "family": "motion", "tier": "tunable", "lightValue": "500ms", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "500ms", "comment": "tunable", "utility": { "duration": "duration-slower", "slug": "slower" } }, { "name": "--ease-in-out", "aliasOf": null, "family": "motion", "tier": "tunable", "lightValue": "cubic-bezier(0.65, 0, 0.35, 1)", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "cubic-bezier(0.65, 0, 0.35, 1)", "comment": "tunable", "utility": { "ease": "ease-in-out", "slug": "in-out" } }, { "name": "--ease-out", "aliasOf": null, "family": "motion", "tier": "tunable", "lightValue": "cubic-bezier(0.16, 1, 0.3, 1)", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "cubic-bezier(0.16, 1, 0.3, 1)", "comment": "tunable", "utility": { "ease": "ease-out", "slug": "out" } }, { "name": "--ease-overshoot", "aliasOf": null, "family": "motion", "tier": "tunable", "lightValue": "cubic-bezier(0.68, -0.55, 0.265, 1.55)", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "cubic-bezier(0.68, -0.55, 0.265, 1.55)", "comment": "tunable", "utility": { "ease": "ease-overshoot", "slug": "overshoot" } }, { "name": "--ease-spring", "aliasOf": null, "family": "motion", "tier": "tunable", "lightValue": "cubic-bezier(0.34, 1.56, 0.64, 1)", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "cubic-bezier(0.34, 1.56, 0.64, 1)", "comment": "tunable", "utility": { "ease": "ease-spring", "slug": "spring" } }, { "name": "--opacity-disabled", "aliasOf": null, "family": "opacity", "tier": "locked", "lightValue": "0.5", "darkValue": null, "rawLight": "0.5", "rawDark": null, "themeMapping": null, "comment": "locked", "utility": {} }, { "name": "--opacity-hover", "aliasOf": null, "family": "opacity", "tier": "locked", "lightValue": "0.06", "darkValue": null, "rawLight": "0.06", "rawDark": null, "themeMapping": null, "comment": "locked — matches --state-hover", "utility": {} }, { "name": "--opacity-loading", "aliasOf": null, "family": "opacity", "tier": "locked", "lightValue": "0.7", "darkValue": null, "rawLight": "0.7", "rawDark": null, "themeMapping": null, "comment": "locked", "utility": {} }, { "name": "--opacity-overlay", "aliasOf": null, "family": "opacity", "tier": "locked", "lightValue": "0.3", "darkValue": null, "rawLight": "0.3", "rawDark": null, "themeMapping": null, "comment": "locked", "utility": {} }, { "name": "--opacity-pressed", "aliasOf": null, "family": "opacity", "tier": "locked", "lightValue": "0.12", "darkValue": null, "rawLight": "0.12", "rawDark": null, "themeMapping": null, "comment": "locked — matches --state-active", "utility": {} }, { "name": "--radius-lg", "aliasOf": "--radius", "family": "radius", "tier": "locked", "lightValue": "0.625rem", "darkValue": null, "rawLight": "0.625rem", "rawDark": null, "themeMapping": "var(--radius)", "comment": "locked — feeds --radius-sm/md/lg/xl", "utility": { "rounded": "rounded-lg", "slug": "lg" } }, { "name": "--radius-md", "aliasOf": null, "family": "radius", "tier": "locked", "lightValue": "calc(var(--radius) - 2px)", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "calc(var(--radius) - 2px)", "comment": "locked", "utility": { "rounded": "rounded-md", "slug": "md" } }, { "name": "--radius-sm", "aliasOf": null, "family": "radius", "tier": "locked", "lightValue": "calc(var(--radius) - 4px)", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "calc(var(--radius) - 4px)", "comment": "locked", "utility": { "rounded": "rounded-sm", "slug": "sm" } }, { "name": "--radius-xl", "aliasOf": null, "family": "radius", "tier": "locked", "lightValue": "calc(var(--radius) + 4px)", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "calc(var(--radius) + 4px)", "comment": "locked", "utility": { "rounded": "rounded-xl", "slug": "xl" } }, { "name": "--radius-button", "aliasOf": null, "family": "radius", "tier": "brand", "lightValue": "9999px", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "9999px", "comment": "brand — pill default (matches marketing CTAs)", "utility": { "rounded": "rounded-button", "slug": "button" } }, { "name": "--radius-card", "aliasOf": null, "family": "radius", "tier": "brand", "lightValue": "1.5rem", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "1.5rem", "comment": "brand", "utility": { "rounded": "rounded-card", "slug": "card" } }, { "name": "--radius-chip", "aliasOf": null, "family": "radius", "tier": "brand", "lightValue": "9999px", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "9999px", "comment": "brand", "utility": { "rounded": "rounded-chip", "slug": "chip" } }, { "name": "--radius-dialog", "aliasOf": null, "family": "radius", "tier": "brand", "lightValue": "2rem", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "2rem", "comment": "brand", "utility": { "rounded": "rounded-dialog", "slug": "dialog" } }, { "name": "--radius-input", "aliasOf": null, "family": "radius", "tier": "brand", "lightValue": "1.25rem", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "1.25rem", "comment": "brand", "utility": { "rounded": "rounded-input", "slug": "input" } }, { "name": "--radius-popover", "aliasOf": null, "family": "radius", "tier": "brand", "lightValue": "1.5rem", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "1.5rem", "comment": "brand", "utility": { "rounded": "rounded-popover", "slug": "popover" } }, { "name": "--radius-sheet", "aliasOf": null, "family": "radius", "tier": "brand", "lightValue": "1.25rem", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "1.25rem", "comment": "brand", "utility": { "rounded": "rounded-sheet", "slug": "sheet" } }, { "name": "--radius-shell", "aliasOf": null, "family": "radius", "tier": "brand", "lightValue": "2.75rem", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "2.75rem", "comment": "brand — outer page-card radius (marketing shell)", "utility": { "rounded": "rounded-shell", "slug": "shell" } }, { "name": "--shadow-focus", "aliasOf": null, "family": "shadow", "tier": "locked", "lightValue": "0 0 0 var(--ring-width) var(--ring)", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "0 0 0 var(--ring-width) var(--ring)", "comment": "locked composition (uses --ring-width)", "utility": { "shadow": "shadow-focus", "slug": "focus" } }, { "name": "--shadow-pill", "aliasOf": null, "family": "shadow", "tier": "brand", "lightValue": "0 4px 14px -6px oklch(0 0 0 / 0.18)", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "0 4px 14px -6px oklch(0 0 0 / 0.18)", "comment": "tunable — used by floating brand chips", "utility": { "shadow": "shadow-pill", "slug": "pill" } }, { "name": "--shadow-card", "aliasOf": null, "family": "shadow", "tier": "tunable", "lightValue": "0 1px 2px oklch(0 0 0 / 0.04)", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "0 1px 2px oklch(0 0 0 / 0.04)", "comment": "tunable", "utility": { "shadow": "shadow-card", "slug": "card" } }, { "name": "--shadow-inset", "aliasOf": null, "family": "shadow", "tier": "tunable", "lightValue": "inset 0 1px 2px oklch(0 0 0 / 0.06)", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "inset 0 1px 2px oklch(0 0 0 / 0.06)", "comment": "tunable", "utility": { "shadow": "shadow-inset", "slug": "inset" } }, { "name": "--shadow-overlay", "aliasOf": null, "family": "shadow", "tier": "tunable", "lightValue": "0 24px 48px -16px oklch(0 0 0 / 0.24)", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "0 24px 48px -16px oklch(0 0 0 / 0.24)", "comment": "tunable", "utility": { "shadow": "shadow-overlay", "slug": "overlay" } }, { "name": "--shadow-popover", "aliasOf": null, "family": "shadow", "tier": "tunable", "lightValue": "0 8px 24px -8px oklch(0 0 0 / 0.18)", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "0 8px 24px -8px oklch(0 0 0 / 0.18)", "comment": "tunable", "utility": { "shadow": "shadow-popover", "slug": "popover" } }, { "name": "--size-avatar-lg", "aliasOf": null, "family": "sizing", "tier": "locked", "lightValue": "3rem", "darkValue": null, "rawLight": "3rem", "rawDark": null, "themeMapping": null, "comment": "locked", "utility": {} }, { "name": "--size-avatar-md", "aliasOf": null, "family": "sizing", "tier": "locked", "lightValue": "2.5rem", "darkValue": null, "rawLight": "2.5rem", "rawDark": null, "themeMapping": null, "comment": "locked", "utility": {} }, { "name": "--size-avatar-sm", "aliasOf": null, "family": "sizing", "tier": "locked", "lightValue": "1.5rem", "darkValue": null, "rawLight": "1.5rem", "rawDark": null, "themeMapping": null, "comment": "locked", "utility": {} }, { "name": "--size-avatar-xl", "aliasOf": null, "family": "sizing", "tier": "locked", "lightValue": "4rem", "darkValue": null, "rawLight": "4rem", "rawDark": null, "themeMapping": null, "comment": "locked", "utility": {} }, { "name": "--size-control-lg", "aliasOf": null, "family": "sizing", "tier": "locked", "lightValue": "2.5rem", "darkValue": null, "rawLight": "2.5rem", "rawDark": null, "themeMapping": null, "comment": "locked", "utility": {} }, { "name": "--size-control-md", "aliasOf": null, "family": "sizing", "tier": "locked", "lightValue": "2.25rem", "darkValue": null, "rawLight": "2.25rem", "rawDark": null, "themeMapping": null, "comment": "locked — feeds --density-control-h in comfortable", "utility": {} }, { "name": "--size-control-sm", "aliasOf": null, "family": "sizing", "tier": "locked", "lightValue": "2rem", "darkValue": null, "rawLight": "2rem", "rawDark": null, "themeMapping": null, "comment": "locked — feeds --density-control-h in compact", "utility": {} }, { "name": "--size-icon-lg", "aliasOf": null, "family": "sizing", "tier": "locked", "lightValue": "1.5rem", "darkValue": null, "rawLight": "1.5rem", "rawDark": null, "themeMapping": null, "comment": "locked", "utility": {} }, { "name": "--size-icon-md", "aliasOf": null, "family": "sizing", "tier": "locked", "lightValue": "1rem", "darkValue": null, "rawLight": "1rem", "rawDark": null, "themeMapping": null, "comment": "locked", "utility": {} }, { "name": "--size-icon-sm", "aliasOf": null, "family": "sizing", "tier": "locked", "lightValue": "0.75rem", "darkValue": null, "rawLight": "0.75rem", "rawDark": null, "themeMapping": null, "comment": "locked", "utility": {} }, { "name": "--size-touch-target", "aliasOf": null, "family": "sizing", "tier": "locked", "lightValue": "2.75rem", "darkValue": null, "rawLight": "2.75rem", "rawDark": null, "themeMapping": null, "comment": "locked — minimum a11y touch target", "utility": {} }, { "name": "--z-index-base", "aliasOf": null, "family": "z-index", "tier": "locked", "lightValue": "0", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "0", "comment": "locked", "utility": { "z": "z-base", "slug": "base" } }, { "name": "--z-index-dropdown", "aliasOf": null, "family": "z-index", "tier": "locked", "lightValue": "40", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "40", "comment": "locked", "utility": { "z": "z-dropdown", "slug": "dropdown" } }, { "name": "--z-index-modal", "aliasOf": null, "family": "z-index", "tier": "locked", "lightValue": "60", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "60", "comment": "locked", "utility": { "z": "z-modal", "slug": "modal" } }, { "name": "--z-index-overlay", "aliasOf": null, "family": "z-index", "tier": "locked", "lightValue": "50", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "50", "comment": "locked", "utility": { "z": "z-overlay", "slug": "overlay" } }, { "name": "--z-index-popover", "aliasOf": null, "family": "z-index", "tier": "locked", "lightValue": "60", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "60", "comment": "locked", "utility": { "z": "z-popover", "slug": "popover" } }, { "name": "--z-index-sticky", "aliasOf": null, "family": "z-index", "tier": "locked", "lightValue": "30", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "30", "comment": "locked", "utility": { "z": "z-sticky", "slug": "sticky" } }, { "name": "--z-index-toast", "aliasOf": null, "family": "z-index", "tier": "locked", "lightValue": "80", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "80", "comment": "locked", "utility": { "z": "z-toast", "slug": "toast" } }, { "name": "--z-index-tooltip", "aliasOf": null, "family": "z-index", "tier": "locked", "lightValue": "70", "darkValue": null, "rawLight": null, "rawDark": null, "themeMapping": "70", "comment": "locked", "utility": { "z": "z-tooltip", "slug": "tooltip" } } ] }