{
  "$comment": "Chalkline design tokens. Source of truth: styles.css :root and [data-theme=\"light\"]. Machine-readable mirror of the tokens documented at https://chalkline.com/brand#tokens.",
  "name": "Chalkline design tokens",
  "version": "1.1.0",
  "updated": "2026-10-01",
  "semanticSurfaces": {
    "description": "Theme-aware aliases. Default (no attribute) resolves to the dark values; add data-theme=\"light\" to a container to switch.",
    "tokens": {
      "--bg-page":          { "dark": "#07100E", "light": "#F2F5F4" },
      "--surface-recessed": { "dark": "#0C1614", "light": "#F7F9F8" },
      "--surface-card":     { "dark": "#0B1817", "light": "#FFFFFF" },
      "--surface-inset":    { "dark": "#122120", "light": "#EEF2F1" },
      "--surface-track":    { "dark": "#0C1614", "light": "#E7ECEA" },
      "--text-primary":     { "dark": "#EFF6F4", "light": "#07100E" },
      "--text-body":        { "dark": "#C9D8D4", "light": "#2A3835" },
      "--text-muted":       { "dark": "#8FA4A0", "light": "#5C6E6A" },
      "--text-faint":       { "dark": "#5C6E6A", "light": "#8FA4A0" },
      "--border-hairline":  { "dark": "rgba(238, 248, 246, 0.08)", "light": "#D9E0DE" },
      "--border-strong":    { "dark": "rgba(238, 248, 246, 0.14)", "light": "#C3CCC9" },
      "--accent":           { "dark": "#3FE85F", "light": "#3FE85F" }
    }
  },
  "onLightSpectrum": {
    "description": "Accessible variants of the five-color spectrum for text/icons on light surfaces. Verified WCAG 4.5:1+ against both #FFFFFF and #F2F5F4 (bg-page in light theme).",
    "tokens": {
      "--green-on-light":  { "value": "#1A7A30", "contrastOnWhite": 5.43, "contrastOnPage": 4.95 },
      "--cyan-on-light":   { "value": "#0E7490", "contrastOnWhite": 5.36, "contrastOnPage": 4.88 },
      "--indigo-on-light": { "value": "#4338CA", "contrastOnWhite": 7.90, "contrastOnPage": 7.20 },
      "--violet-on-light": { "value": "#7E22CE", "contrastOnWhite": 6.98, "contrastOnPage": 6.37 },
      "--pink-on-light":   { "value": "#BE185D", "contrastOnWhite": 6.04, "contrastOnPage": 5.50 }
    }
  },
  "status": {
    "description": "Fixed bg/text pairs for status badges and callouts. Theme-agnostic (not remapped by data-theme).",
    "tokens": {
      "--status-success-bg":        "#E3F6E7",
      "--status-success-bg-subtle": "#F4FBF6",
      "--status-success-text":      "#14652A",
      "--status-neutral-bg":        "#EEF2F1",
      "--status-neutral-text":      "#5C6E6A",
      "--status-error-bg":          "#FDEDED",
      "--status-error-text":        "#B91C1C",
      "--strike":                   "#F87171"
    }
  },
  "radius": {
    "description": "The full corner-radius scale. Formalizes values already in use across the site.",
    "tokens": {
      "--radius-xs":     "4px",
      "--radius-sm":     "6px",
      "--radius-md":     "8px",
      "--radius-lg":     "10px",
      "--radius-pill":   "999px",
      "--radius-device": "38px"
    }
  },
  "fluidType": {
    "description": "clamp()-based sizes that scale down for mobile without a separate breakpoint.",
    "tokens": {
      "--fs-eyebrow":  "clamp(11px, 2.6vw, 13px)",
      "--fs-body-sm":  "clamp(15px, 3.6vw, 16px)",
      "--fs-display":  "clamp(52px, 7vw, 76px)",
      "--ls-heading":  "-0.02em"
    }
  }
}