version: "1.0"
name: "Claymorphism"

colors:
  background: "#F0E7FF"
  surface: "#FFFFFF"
  text-primary: "#3D2A6B"
  text-secondary: "#7C6BA8"
  border: "none"
  accent-1: "#7C5CFF"
  accent-2: "#FF9BD2"
  accent-3: "#8CE7FF"
  shadow: "rgba(124,92,255,0.20)"

typography:
  headline-lg:
    family: "Inter"
    weight: 700
    size: "48px"
    line-height: "1.08"
    letter-spacing: "-0.03em"
  headline-sm:
    family: "Inter"
    weight: 700
    size: "24px"
    line-height: "1.25"
  body-md:
    family: "Inter"
    weight: 400
    size: "16px"
    line-height: "1.6"
  label-md:
    family: "Inter"
    weight: 600
    size: "13px"
    text-transform: "uppercase"
    letter-spacing: "0.05em"

rounded:
  sm: "18px"
  md: "28px"
  lg: "34px"

spacing:
  xs: "8px"
  sm: "16px"
  md: "24px"
  lg: "40px"

border-width:
  sm: "0px"
  md: "0px"
  lg: "0px"

components:
  button-primary:
    background: "#7C5CFF"
    color: "#FFFFFF"
    border: "none"
    border-radius: "20px"
    box-shadow: "0 8px 16px rgba(124,92,255,0.35), inset 0 -4px 0 rgba(0,0,0,0.15)"
    padding: "12px 22px"

  clay-card:
    background: "#FFFFFF"
    border-radius: "28px"
    box-shadow: "0 16px 32px rgba(124,92,255,0.20), inset 0 -6px 0 rgba(124,92,255,0.10)"
    padding: "24px"

rationale:
  - Surfaces should look squeezable and cheerful, with depth coming from puffed shadows rather than realism.
  - Favor pastel contrast and rounded grouping so the whole UI feels toy-like but still premium.