{
  "$description": "Kip-Up · tokens de marca e interfaz. Kip-Up no tenía colores de estado definidos. success e info son una PROPUESTA de este kit, no marca establecida: salen de las paletas de las que ya vienen el rojo y el naranja de Kip-Up (#2A9D8F y #457B9D conviven con #E63946 y #F4A261 en las paletas de origen). warning reutiliza el naranja de marca y danger el rojo de marca. Si la marca fija otros, se cambian aquí y en ningún sitio más.",
  "color": {
    "$type": "color",
    "marca": {
      "ink": {
        "$value": "#1A1A2E",
        "$description": "Texto principal, logo, fondos oscuros"
      },
      "red": {
        "$value": "#E63946",
        "$description": "Color de acción, la flecha, llamadas a la acción"
      },
      "orange": {
        "$value": "#F4A261",
        "$description": "Acento secundario, ilustración"
      },
      "cream": {
        "$value": "#F8F5F0",
        "$description": "Fondo claro por defecto"
      },
      "white": {
        "$value": "#FFFFFF",
        "$description": "Fondos y texto sobre oscuro"
      },
      "ink-70": {
        "$value": "#55556A",
        "$description": "Texto secundario sobre claro"
      },
      "cream-70": {
        "$value": "#B9B6C9",
        "$description": "Texto secundario sobre oscuro"
      }
    },
    "ink": {
      "50": {
        "$value": "#F8F5F0"
      },
      "100": {
        "$value": "#E1DFDE"
      },
      "200": {
        "$value": "#C2C0C5"
      },
      "300": {
        "$value": "#A3A1AB"
      },
      "400": {
        "$value": "#7E7D8D"
      },
      "500": {
        "$value": "#55556A"
      },
      "600": {
        "$value": "#46465B"
      },
      "700": {
        "$value": "#39394E"
      },
      "800": {
        "$value": "#2D2D42"
      },
      "900": {
        "$value": "#222236"
      },
      "950": {
        "$value": "#1A1A2E"
      }
    },
    "red": {
      "50": {
        "$value": "#FFF5F4"
      },
      "100": {
        "$value": "#FFDFDD"
      },
      "200": {
        "$value": "#FFC0BD"
      },
      "300": {
        "$value": "#FF9D99"
      },
      "400": {
        "$value": "#FC6D6E"
      },
      "500": {
        "$value": "#E63946"
      },
      "600": {
        "$value": "#C80E2E"
      },
      "700": {
        "$value": "#A50022"
      },
      "800": {
        "$value": "#840019"
      },
      "900": {
        "$value": "#630312"
      },
      "950": {
        "$value": "#4C060E"
      }
    },
    "orange": {
      "50": {
        "$value": "#FFF6EF"
      },
      "100": {
        "$value": "#FFEBDD"
      },
      "200": {
        "$value": "#FFDCC2"
      },
      "300": {
        "$value": "#FFCBA5"
      },
      "400": {
        "$value": "#FDB782"
      },
      "500": {
        "$value": "#F4A261"
      },
      "600": {
        "$value": "#CB7D3A"
      },
      "700": {
        "$value": "#A35E1F"
      },
      "800": {
        "$value": "#7C4614"
      },
      "900": {
        "$value": "#572F09"
      },
      "950": {
        "$value": "#3F2005"
      }
    },
    "success": {
      "50": {
        "$value": "#EEFBF9"
      },
      "100": {
        "$value": "#D8EEEA"
      },
      "200": {
        "$value": "#B6DED7"
      },
      "300": {
        "$value": "#91CDC3"
      },
      "400": {
        "$value": "#63B8AB"
      },
      "500": {
        "$value": "#2A9D8F"
      },
      "600": {
        "$value": "#008174"
      },
      "700": {
        "$value": "#00675C"
      },
      "800": {
        "$value": "#005047"
      },
      "900": {
        "$value": "#003A33"
      },
      "950": {
        "$value": "#002B26"
      }
    },
    "warning": {
      "50": {
        "$value": "#FFF6EF"
      },
      "100": {
        "$value": "#FFEBDD"
      },
      "200": {
        "$value": "#FFDCC2"
      },
      "300": {
        "$value": "#FFCBA5"
      },
      "400": {
        "$value": "#FDB782"
      },
      "500": {
        "$value": "#F4A261"
      },
      "600": {
        "$value": "#CB7D3A"
      },
      "700": {
        "$value": "#A35E1F"
      },
      "800": {
        "$value": "#7C4614"
      },
      "900": {
        "$value": "#572F09"
      },
      "950": {
        "$value": "#3F2005"
      }
    },
    "danger": {
      "50": {
        "$value": "#FFF5F4"
      },
      "100": {
        "$value": "#FFDFDD"
      },
      "200": {
        "$value": "#FFC0BD"
      },
      "300": {
        "$value": "#FF9D99"
      },
      "400": {
        "$value": "#FC6D6E"
      },
      "500": {
        "$value": "#E63946"
      },
      "600": {
        "$value": "#C80E2E"
      },
      "700": {
        "$value": "#A50022"
      },
      "800": {
        "$value": "#840019"
      },
      "900": {
        "$value": "#630312"
      },
      "950": {
        "$value": "#4C060E"
      }
    },
    "info": {
      "50": {
        "$value": "#F1F9FE"
      },
      "100": {
        "$value": "#DBE8F1"
      },
      "200": {
        "$value": "#BAD1E1"
      },
      "300": {
        "$value": "#98B9D0"
      },
      "400": {
        "$value": "#6F9CBA"
      },
      "500": {
        "$value": "#457B9D"
      },
      "600": {
        "$value": "#2F6586"
      },
      "700": {
        "$value": "#20526F"
      },
      "800": {
        "$value": "#194057"
      },
      "900": {
        "$value": "#132F41"
      },
      "950": {
        "$value": "#0F2431"
      }
    }
  },
  "tema": {
    "claro": {
      "$type": "color",
      "bg": {
        "$value": "{color.marca.cream}"
      },
      "surface": {
        "$value": "{color.marca.white}"
      },
      "surface-2": {
        "$value": "{color.ink.50}"
      },
      "line": {
        "$value": "{color.ink.200}"
      },
      "line-strong": {
        "$value": "{color.ink.300}"
      },
      "line-field": {
        "$value": "{color.ink.400}",
        "$description": "Borde de campo: WCAG 1.4.11 pide 3:1 y los grises de separador no llegan."
      },
      "text": {
        "$value": "{color.marca.ink}"
      },
      "text-muted": {
        "$value": "{color.marca.ink-70}"
      },
      "link": {
        "$value": "{color.red.700}",
        "$description": "El rojo de marca da 3.83:1 sobre crema; red.700 llega a AA."
      },
      "focus": {
        "$value": "{color.red.500}"
      }
    },
    "oscuro": {
      "$type": "color",
      "bg": {
        "$value": "#12121F"
      },
      "surface": {
        "$value": "{color.marca.ink}"
      },
      "surface-2": {
        "$value": "#26263D"
      },
      "surface-3": {
        "$value": "#33334D"
      },
      "line": {
        "$value": "#2E2E48"
      },
      "line-strong": {
        "$value": "#454563"
      },
      "line-field": {
        "$value": "#7E7D8D"
      },
      "text": {
        "$value": "{color.marca.cream}"
      },
      "text-muted": {
        "$value": "{color.marca.cream-70}"
      },
      "link": {
        "$value": "{color.red.300}",
        "$description": "El rojo de marca da 4.09:1 sobre el navy; red.300 llega a AA."
      },
      "focus": {
        "$value": "{color.red.400}"
      }
    }
  },
  "fuente": {
    "$type": "fontFamily",
    "titulo": {
      "$value": [
        "Poppins",
        "Segoe UI",
        "Arial",
        "sans-serif"
      ],
      "$description": "Poppins SemiBold/Bold. También el logotipo."
    },
    "texto": {
      "$value": [
        "Inter",
        "system-ui",
        "Arial",
        "sans-serif"
      ]
    },
    "mono": {
      "$value": [
        "ui-monospace",
        "SFMono-Regular",
        "Menlo",
        "monospace"
      ],
      "$description": "Kip-Up no tiene monoespaciada de marca: pila del sistema."
    }
  },
  "peso-fuente": {
    "$type": "fontWeight",
    "regular": {
      "$value": 400
    },
    "medio": {
      "$value": 500
    },
    "semibold": {
      "$value": 600
    },
    "bold": {
      "$value": 700
    }
  },
  "tamano-fuente": {
    "$type": "dimension",
    "display": {
      "$value": {
        "value": 44,
        "unit": "px"
      }
    },
    "h1": {
      "$value": {
        "value": 32,
        "unit": "px"
      }
    },
    "h2": {
      "$value": {
        "value": 24,
        "unit": "px"
      }
    },
    "h3": {
      "$value": {
        "value": 18,
        "unit": "px"
      }
    },
    "cuerpo": {
      "$value": {
        "value": 15,
        "unit": "px"
      }
    },
    "pequeno": {
      "$value": {
        "value": 13,
        "unit": "px"
      }
    },
    "micro": {
      "$value": {
        "value": 11,
        "unit": "px"
      }
    }
  },
  "radio": {
    "$type": "dimension",
    "sm": {
      "$value": {
        "value": 8,
        "unit": "px"
      }
    },
    "md": {
      "$value": {
        "value": 12,
        "unit": "px"
      }
    },
    "lg": {
      "$value": {
        "value": 20,
        "unit": "px"
      }
    },
    "pill": {
      "$value": {
        "value": 999,
        "unit": "px"
      }
    }
  },
  "espacio": {
    "1": {
      "$value": {
        "value": 4,
        "unit": "px"
      }
    },
    "2": {
      "$value": {
        "value": 8,
        "unit": "px"
      }
    },
    "3": {
      "$value": {
        "value": 12,
        "unit": "px"
      }
    },
    "4": {
      "$value": {
        "value": 16,
        "unit": "px"
      }
    },
    "5": {
      "$value": {
        "value": 20,
        "unit": "px"
      }
    },
    "6": {
      "$value": {
        "value": 24,
        "unit": "px"
      }
    },
    "8": {
      "$value": {
        "value": 32,
        "unit": "px"
      }
    },
    "10": {
      "$value": {
        "value": 40,
        "unit": "px"
      }
    },
    "12": {
      "$value": {
        "value": 48,
        "unit": "px"
      }
    },
    "16": {
      "$value": {
        "value": 64,
        "unit": "px"
      }
    },
    "$type": "dimension"
  },
  "sombra": {
    "$type": "shadow",
    "suave": {
      "$value": [
        {
          "color": "#1A1A2E0F",
          "offsetX": {
            "value": 0,
            "unit": "px"
          },
          "offsetY": {
            "value": 1,
            "unit": "px"
          },
          "blur": {
            "value": 2,
            "unit": "px"
          },
          "spread": {
            "value": 0,
            "unit": "px"
          }
        },
        {
          "color": "#1A1A2E0F",
          "offsetX": {
            "value": 0,
            "unit": "px"
          },
          "offsetY": {
            "value": 2,
            "unit": "px"
          },
          "blur": {
            "value": 6,
            "unit": "px"
          },
          "spread": {
            "value": 0,
            "unit": "px"
          }
        }
      ]
    },
    "elevada": {
      "$value": [
        {
          "color": "#1A1A2E24",
          "offsetX": {
            "value": 0,
            "unit": "px"
          },
          "offsetY": {
            "value": 10,
            "unit": "px"
          },
          "blur": {
            "value": 30,
            "unit": "px"
          },
          "spread": {
            "value": 0,
            "unit": "px"
          }
        }
      ]
    }
  }
}
