{
  "$schema": "https://design-tokens.github.io/community-group/format/",
  "brand": "Kelas Sekejap",
  "theme": "Say it with confidence",
  "version": "8",
  "color": {
    "primary": {
      "haze":  { "value": "#efebe1", "text": "ink",   "role": "Warm neutral base / default background" },
      "blue":  { "value": "#2557ff", "text": "white", "role": "Loud brand anchor / hero / SPM recognition" },
      "flame": { "value": "#e64c09", "text": "ink", "role": "The action colour / one CTA per view. Ink text (decision A1) — white fails AA at body sizes; white icons ok" }
    },
    "secondary": {
      "sunflower": { "value": "#f0c84b", "text": "ink",   "role": "Highlights & reward moments" },
      "pulse":     { "value": "#f49eaf", "text": "ink",   "role": "Social, warmth, campaign emphasis" },
      "moss":      { "value": "#2fa36b", "text": "ink", "role": "Progress, growth, support. Ink text — white fails AA at body sizes; white icons ok" },
      "spark":     { "value": "#f68868", "text": "ink",   "role": "Celebrations, friendly alerts" },
      "paper":     { "value": "#ffffff", "text": "ink",   "role": "Cards, modals, content surfaces" },
      "ink":       { "value": "#101014", "text": "white", "role": "Text, outlines, icons, contrast" }
    },
    "utility": {
      "disabledFill": { "value": "#dedbd3" }
    }
  },
  "font": {
    "display": { "value": "Archivo Black", "usage": "Uppercase stacked headlines. Tracking -0.065 to -0.085em, leading 0.8–0.86, 56–96px." },
    "body":    { "value": "Plus Jakarta Sans", "usage": "Body & UI. Runs heavy — weights 700/800/900." },
    "mono":    { "value": "JetBrains Mono", "usage": "Eyebrow labels, tags, tokens. Uppercase, tracking 0.06–0.1em, weight 800." }
  },
  "space": {
    "1": "4px", "2": "8px", "3": "12px", "4": "16px", "5": "20px",
    "6": "24px", "7": "32px", "8": "40px", "9": "48px", "10": "64px",
    "base": "4px"
  },
  "radius": {
    "sm": "14px", "md": "20px", "lg": "28px", "xl": "36px", "pill": "999px"
  },
  "border": { "value": "2px solid #101014", "note": "The firm Ink outline — on every surface." },
  "shadow": {
    "sm":     { "value": "4px 4px 0 #101014" },
    "button": { "value": "5px 5px 0 #101014" },
    "card":   { "value": "8px 8px 0 #101014" },
    "hover":  { "value": "7px 7px 0 #101014" },
    "soft":   { "value": "0 22px 60px rgba(16,16,20,.14)", "note": "Blur is MARKETING/hero only — never inside learning UI." }
  },
  "focusRing": { "value": "0 0 0 3px #efebe1, 0 0 0 6px #2557ff" },
  "state": {
    "pressed":  "translate(5px,5px), shadow removed — a physical push into the shadow",
    "hover":    "translate(-2px,-2px), shadow grows to 7px 7px 0 Ink",
    "focus":    "add Blue focus ring offset by Haze",
    "disabled": "fill #dedbd3, text rgba(16,16,20,.45), border rgba(16,16,20,.18), no shadow",
    "error":    "fill rgba(230,76,9,.1), 2px Flame border, Ink text"
  }
}