{
  "color": {
    "blue": {
      "50":  { "$value": "#eef1fa", "$type": "color", "$description": "Brand-tinted background for cards, banners, callouts" },
      "100": { "$value": "#dbe2f5", "$type": "color", "$description": "Soft brand surface" },
      "200": { "$value": "#b6c4eb", "$type": "color" },
      "300": { "$value": "#7d92d6", "$type": "color" },
      "500": { "$value": "#1e44c4", "$type": "color" },
      "700": { "$value": "#0021a6", "$type": "color", "$description": "USA Clean primary brand blue" },
      "800": { "$value": "#001580", "$type": "color", "$description": "Brand blue, hover/pressed" },
      "900": { "$value": "#0d1a4d", "$type": "color", "$description": "Deep navy used in announcement bar and footer (semantic: brand.deep)" }
    },

    "gold": {
      "50":  { "$value": "#fff8e6", "$type": "color" },
      "100": { "$value": "#ffeac1", "$type": "color" },
      "300": { "$value": "#f7c25a", "$type": "color" },
      "500": { "$value": "#efaa22", "$type": "color", "$description": "USA Clean accent gold" },
      "600": { "$value": "#d8951a", "$type": "color", "$description": "Accent gold, hover" },
      "700": { "$value": "#8b5a00", "$type": "color", "$description": "Deep gold for accent text on light surfaces. WCAG 2.2 AA: 5.93:1 vs white, 5.0:1 vs gold-tinted surface (passes 4.5:1)." }
    },

    "gray": {
      "0":   { "$value": "#ffffff", "$type": "color", "$description": "Page background" },
      "50":  { "$value": "#f5f7fa", "$type": "color", "$description": "Subtle surface (consolidated — replaces former #f5f5f5)" },
      "150": { "$value": "#f4f5f7", "$type": "color", "$description": "Search bar background — slightly different from gray.50, kept separate" },
      "200": { "$value": "#ececec", "$type": "color", "$description": "Muted surface, also used as subtle border" },
      "300": { "$value": "#d9d9d9", "$type": "color", "$description": "Default border, also used for placeholder strokes" },
      "400": { "$value": "#c0c0c0", "$type": "color", "$description": "Card hover border" },
      "500": { "$value": "#757575", "$type": "color", "$description": "Muted text" },
      "600": { "$value": "#5d5d5d", "$type": "color", "$description": "Subtle text" },
      "700": { "$value": "#3a3a3a", "$type": "color" },
      "800": { "$value": "#222222", "$type": "color", "$description": "Secondary text" },
      "900": { "$value": "#131313", "$type": "color", "$description": "Default body text, also used for solid black contexts (badges)" },
      "950": { "$value": "#1b252d", "$type": "color", "$description": "Dark surface (machine card image bg)" }
    },

    "green": {
      "50":  { "$value": "#e6f7e6", "$type": "color", "$description": "Success surface" },
      "100": { "$value": "#e6f4ea", "$type": "color", "$description": "Success surface — bundle docs variant (slight green-blue lean)" },
      "300": { "$value": "#86efac", "$type": "color", "$description": "Success border" },
      "500": { "$value": "#00a900", "$type": "color", "$description": "Success" },
      "800": { "$value": "#15692a", "$type": "color", "$description": "Canonical success text on light backgrounds (WCAG AA)" }
    },

    "amber": {
      "50":  { "$value": "#fff7e6", "$type": "color", "$description": "Warning surface" },
      "75":  { "$value": "#fff4dc", "$type": "color", "$description": "Warning surface — bundle docs callout variant" },
      "300": { "$value": "#fde68a", "$type": "color", "$description": "Warning border" },
      "500": { "$value": "#d97706", "$type": "color", "$description": "Warning" },
      "700": { "$value": "#92400e", "$type": "color", "$description": "Canonical warning text on light backgrounds (WCAG AA)" }
    },

    "red": {
      "50":  { "$value": "#fef2f2", "$type": "color", "$description": "Error surface" },
      "100": { "$value": "#fbe9eb", "$type": "color", "$description": "Error surface — bundle docs callout variant" },
      "500": { "$value": "#c70e1d", "$type": "color", "$description": "Error" },
      "600": { "$value": "#a80c18", "$type": "color", "$description": "Error, hover" },
      "800": { "$value": "#991b1b", "$type": "color", "$description": "Canonical error text on light backgrounds (WCAG AA)" }
    },

    "indigo": {
      "50":  { "$value": "#eff6ff", "$type": "color", "$description": "Info surface" },
      "300": { "$value": "#bfdbfe", "$type": "color", "$description": "Info border" },
      "700": { "$value": "#1e40af", "$type": "color", "$description": "Info text" }
    },

    "alpha": {
      "$description": "Alpha-channel primitives. Used for overlays, focus rings, hover tints — anywhere we need a translucent base color rather than a solid one.",
      "brand": {
        "04": { "$value": "rgba(0, 33, 166, 0.04)", "$type": "color", "$description": "Brand wash — compat checker header" },
        "06": { "$value": "rgba(0, 33, 166, 0.06)", "$type": "color", "$description": "Brand wash — outline button hover" },
        "08": { "$value": "rgba(0, 33, 166, 0.08)", "$type": "color", "$description": "Brand wash — pill-brand bg" },
        "10": { "$value": "rgba(0, 33, 166, 0.10)", "$type": "color", "$description": "Input focus ring" },
        "20": { "$value": "rgba(0, 33, 166, 0.20)", "$type": "color", "$description": "Brand alert border" }
      },
      "accent": {
        "15": { "$value": "rgba(239, 170, 34, 0.15)", "$type": "color", "$description": "Accent wash — pill-accent bg" },
        "18": { "$value": "rgba(239, 170, 34, 0.18)", "$type": "color" }
      },
      "white": {
        "10": { "$value": "rgba(255, 255, 255, 0.10)", "$type": "color", "$description": "Footer email field bg" },
        "20": { "$value": "rgba(255, 255, 255, 0.20)", "$type": "color", "$description": "Footer email field border" },
        "40": { "$value": "rgba(255, 255, 255, 0.40)", "$type": "color" },
        "50": { "$value": "rgba(255, 255, 255, 0.50)", "$type": "color", "$description": "Outline-light button border" },
        "70": { "$value": "rgba(255, 255, 255, 0.70)", "$type": "color" },
        "85": { "$value": "rgba(255, 255, 255, 0.85)", "$type": "color", "$description": "Wishlist button bg over images" }
      },
      "black": {
        "06": { "$value": "rgba(0, 0, 0, 0.06)", "$type": "color", "$description": "Shadow xs alpha" },
        "08": { "$value": "rgba(0, 0, 0, 0.08)", "$type": "color", "$description": "Shadow sm alpha" },
        "10": { "$value": "rgba(0, 0, 0, 0.10)", "$type": "color", "$description": "Shadow md alpha" },
        "12": { "$value": "rgba(0, 0, 0, 0.12)", "$type": "color", "$description": "Shadow lg alpha" },
        "14": { "$value": "rgba(0, 0, 0, 0.14)", "$type": "color", "$description": "Shadow xl alpha" },
        "50": { "$value": "rgba(0, 0, 0, 0.50)", "$type": "color", "$description": "Machine card overflow button bg" }
      }
    }
  },

  "spacing": {
    "$description": "4px base scale. Numeric keys map to 4px multiples (1=4, 2=8, 3=12, 4=16, …).",
    "0":  { "$value": "0",       "$type": "dimension" },
    "1":  { "$value": "0.25rem", "$type": "dimension", "$description": "4px" },
    "2":  { "$value": "0.5rem",  "$type": "dimension", "$description": "8px" },
    "3":  { "$value": "0.75rem", "$type": "dimension", "$description": "12px" },
    "4":  { "$value": "1rem",    "$type": "dimension", "$description": "16px" },
    "5":  { "$value": "1.25rem", "$type": "dimension", "$description": "20px" },
    "6":  { "$value": "1.5rem",  "$type": "dimension", "$description": "24px" },
    "8":  { "$value": "2rem",    "$type": "dimension", "$description": "32px" },
    "10": { "$value": "2.5rem",  "$type": "dimension", "$description": "40px" },
    "12": { "$value": "3rem",    "$type": "dimension", "$description": "48px" },
    "16": { "$value": "4rem",    "$type": "dimension", "$description": "64px" },
    "20": { "$value": "5rem",    "$type": "dimension", "$description": "80px" },
    "24": { "$value": "6rem",    "$type": "dimension", "$description": "96px" },
    "32": { "$value": "8rem",    "$type": "dimension", "$description": "128px" }
  },

  "radius": {
    "0":    { "$value": "0",       "$type": "dimension" },
    "xs":   { "$value": "3px",     "$type": "dimension", "$description": "Small badge / stock pill" },
    "sm":   { "$value": "4px",     "$type": "dimension" },
    "md":   { "$value": "8px",     "$type": "dimension" },
    "lg":   { "$value": "12px",    "$type": "dimension" },
    "xl":   { "$value": "16px",    "$type": "dimension" },
    "full": { "$value": "9999px",  "$type": "dimension", "$description": "Pills, avatars, fully rounded" }
  },

  "border-width": {
    "0":    { "$value": "0",   "$type": "dimension" },
    "thin": { "$value": "1px", "$type": "dimension" },
    "med":  { "$value": "1.5px", "$type": "dimension", "$description": "Outline button border" },
    "thick":{ "$value": "2px", "$type": "dimension", "$description": "Tab underline, focus" }
  },

  "shadow": {
    "xs":  { "$value": "0 1px 2px {color.alpha.black.06}",   "$type": "shadow" },
    "sm":  { "$value": "0 1px 4px {color.alpha.black.08}",   "$type": "shadow" },
    "md":  { "$value": "0 4px 12px {color.alpha.black.10}",  "$type": "shadow" },
    "lg":  { "$value": "0 8px 24px {color.alpha.black.12}",  "$type": "shadow" },
    "xl":  { "$value": "0 16px 40px {color.alpha.black.14}", "$type": "shadow" }
  },

  "font-family": {
    "sans": {
      "$value": "'Open Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif",
      "$type": "fontFamily",
      "$description": "Default. Open Sans loaded from Google Fonts."
    },
    "mono": {
      "$value": "ui-monospace, SFMono-Regular, Menlo, monospace",
      "$type": "fontFamily",
      "$description": "Code, SKUs, technical specs"
    }
  },

  "font-weight": {
    "regular":  { "$value": 400, "$type": "fontWeight" },
    "medium":   { "$value": 500, "$type": "fontWeight" },
    "semibold": { "$value": 600, "$type": "fontWeight" },
    "bold":     { "$value": 700, "$type": "fontWeight" },
    "extrabold":{ "$value": 800, "$type": "fontWeight", "$description": "Used sparingly — bundle totals, key metrics" }
  },

  "font-size": {
    "$description": "Type scale. Note: prototype uses non-standard naming where 'sm' = body (16px). Preserved in primitives for backwards-compatibility, but new code should consume semantic.typography.* (which has standard naming) instead of these primitives directly.",
    "3xs": { "$value": "0.625rem", "$type": "dimension", "$description": "10px — stock badges, smallest labels (added per D21)" },
    "2xs": { "$value": "0.75rem",  "$type": "dimension", "$description": "12px" },
    "xs":  { "$value": "0.875rem", "$type": "dimension", "$description": "14px" },
    "sm":  { "$value": "1rem",     "$type": "dimension", "$description": "16px (body default)" },
    "md":  { "$value": "1.125rem", "$type": "dimension", "$description": "18px" },
    "lg":  { "$value": "1.25rem",  "$type": "dimension", "$description": "20px" },
    "xl":  { "$value": "1.5rem",   "$type": "dimension", "$description": "24px" },
    "2xl": { "$value": "2rem",     "$type": "dimension", "$description": "32px" },
    "3xl": { "$value": "2.5rem",   "$type": "dimension", "$description": "40px" },
    "4xl": { "$value": "3rem",     "$type": "dimension", "$description": "48px" },
    "5xl": { "$value": "3.5rem",   "$type": "dimension", "$description": "56px — display hero" }
  },

  "line-height": {
    "tight":   { "$value": 1.2, "$type": "number" },
    "snug":    { "$value": 1.3, "$type": "number" },
    "normal":  { "$value": 1.4, "$type": "number" },
    "relaxed": { "$value": 1.5, "$type": "number" },
    "loose":   { "$value": 1.65, "$type": "number", "$description": "Long-form prose (docs, briefs)" }
  },

  "letter-spacing": {
    "tighter": { "$value": "-0.02em", "$type": "dimension" },
    "tight":   { "$value": "-0.01em", "$type": "dimension" },
    "normal":  { "$value": "0",       "$type": "dimension" },
    "wide":    { "$value": "0.03em",  "$type": "dimension", "$description": "Pill labels" },
    "wider":   { "$value": "0.05em",  "$type": "dimension", "$description": "Eyebrows, small caps" },
    "widest":  { "$value": "0.08em",  "$type": "dimension", "$description": "Section header labels" }
  },

  "duration": {
    "instant": { "$value": "0ms",   "$type": "duration" },
    "fast":    { "$value": "120ms", "$type": "duration" },
    "base":    { "$value": "200ms", "$type": "duration" },
    "slow":    { "$value": "320ms", "$type": "duration" }
  },

  "easing": {
    "linear":     { "$value": "linear",                            "$type": "cubicBezier" },
    "ease":       { "$value": "ease",                              "$type": "cubicBezier" },
    "ease-out":   { "$value": "cubic-bezier(0.16, 1, 0.3, 1)",     "$type": "cubicBezier" },
    "ease-in-out":{ "$value": "cubic-bezier(0.65, 0, 0.35, 1)",    "$type": "cubicBezier" }
  },

  "z-index": {
    "$description": "Stacking layers. Steps of 100 leave room for ad-hoc values without colliding.",
    "base":     { "$value": 0,    "$type": "number" },
    "dropdown": { "$value": 200,  "$type": "number" },
    "sticky":   { "$value": 300,  "$type": "number" },
    "overlay":  { "$value": 400,  "$type": "number" },
    "modal":    { "$value": 500,  "$type": "number" },
    "toast":    { "$value": 600,  "$type": "number" }
  },

  "breakpoint": {
    "$description": "Three breakpoints, mobile-first. Use min-width media queries (e.g. @media (min-width: 768px)).",
    "small":  { "$value": "0",      "$type": "dimension", "$description": "Mobile / Small. Default styles target this range (0–767px)." },
    "medium": { "$value": "768px",  "$type": "dimension", "$description": "Tablet / Medium. 768–1199px." },
    "large":  { "$value": "1200px", "$type": "dimension", "$description": "Desktop / Large. 1200px+." }
  },

  "size": {
    "$description": "Component-agnostic sizing primitives (heights, widths, container caps). Component-specific sizes belong in components.json.",
    "control": {
      "xs": { "$value": "28px", "$type": "dimension" },
      "sm": { "$value": "36px", "$type": "dimension" },
      "md": { "$value": "44px", "$type": "dimension", "$description": "Default button/input height" },
      "lg": { "$value": "52px", "$type": "dimension" },
      "xl": { "$value": "60px", "$type": "dimension" }
    },
    "container": {
      "max": { "$value": "1440px", "$type": "dimension", "$description": "Max content width" },
      "sm":  { "$value": "768px",  "$type": "dimension" },
      "md":  { "$value": "1024px", "$type": "dimension" },
      "lg":  { "$value": "1200px", "$type": "dimension" }
    },
    "header-height": {
      "$description": "Header height per breakpoint (D17). Mobile is shorter to maximize content above the fold.",
      "small":  { "$value": "56px", "$type": "dimension" },
      "medium": { "$value": "64px", "$type": "dimension" },
      "large":  { "$value": "72px", "$type": "dimension" }
    }
  },

  "opacity": {
    "$description": "Standard opacity values for state effects.",
    "disabled":      { "$value": 0.4, "$type": "number", "$description": "Deselected/disabled state (D22)" },
    "muted":         { "$value": 0.7, "$type": "number" },
    "scrim-light":   { "$value": 0.5, "$type": "number" },
    "scrim":         { "$value": 0.85, "$type": "number" }
  }
}