{
  "name": "hoverExpand",
  "version": "1.0.0",
  "purpose": "Hover micro-interaction — the element lifts and scales up on hover (translateY + scale; transform only).",
  "output": "css",
  "engine": "native-css",
  "paramSchema": {
    "scale": { "type": "number", "default": 1.06, "min": 1.01, "max": 1.3 },
    "lift": { "type": "string", "default": "4px", "pattern": "^[0-9]*\\.?[0-9]+(px|rem|em)$" },
    "duration": { "type": "number", "default": 0.2, "min": 0.05, "max": 1 }
  },
  "triggerDefaults": {},
  "performance": { "verified": true, "lcpSafe": true, "cost": 1, "verifiedAt": "2026-07-04" },
  "a11y": { "reducedMotionFallback": "static" },
  "template": "{{css target}} { transition: transform {{css params.duration}}s cubic-bezier(0.22, 0.61, 0.36, 1); }\n{{css target}}:hover { transform: translateY(-{{css params.lift}}) scale({{css params.scale}}); }",
  "demo": { "html": "<div class=\"d-hoverExpand\" style=\"display:inline-flex;align-items:center;justify-content:center;width:8rem;height:5rem;border-radius:14px;background:var(--surface);border:1px solid var(--line);cursor:pointer\">Hover — expand</div>", "params": { "scale": 1.08, "lift": "4px", "duration": 0.2 } }
}