3D 折叠面板

双层分工：外层 .item__clip 用 max-height 做裁切收展，内层 .item__body 以顶部为原点从 --fold_deg 翻到 0 度——『收起来』与『翻开』分属两层，动画才有体积感而不只是拉高度。

状态由隐藏 radio 的 :checked 驱动：纯 CSS 拿到点击持久展开 + Tab/方向键键盘支持；:hover 作为第二通道提供『扫过即展开』的轻交互，两层状态互不打架。

max-height 过渡是布局属性（本条目唯一的非 transform 动画），内容高度必须小于 --body_max_px；生产可升级 grid-template-rows: 0fr → 1fr 的现代写法（Edge 111+ 支持插值）。

perspective 放在 .acc 容器上，三个面板共享同一透视，折叠角看起来统一；头部 translateZ(12px) 微微浮起增强层厚。

reduced-motion：过渡与演示动画全关，点击后内容即时显示；chevron 角度瞬时切换。

预览自动演示：body 未被 hover 且第 2 项未选中时，第 2 项以 9s 周期自动翻开再折起；光标进入即让位给真实交互。