기존 화면이 한쪽으로 걷혀 나가며 아래에 이미 있던 새 화면이 드러나는 전환. 커버의 반대입니다.
<div class="stage"><div class="s b">B</div><div class="s a gone">A</div></div>.stage{position:absolute;inset:0;overflow:hidden;background:var(--bg)}
.s{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
font:800 clamp(16px,6vmin,30px)/1 sans-serif;color:#fff;letter-spacing:.04em}
.a{background:linear-gradient(135deg,#3b3b98,#1e1e4a)}
.b{background:linear-gradient(135deg,#f25c8a,#c9184a)}
.gone{animation:reveal 3.6s cubic-bezier(.6,0,.2,1) infinite;box-shadow:0 0 30px rgba(0,0,0,.5)}
@keyframes reveal{0%,20%{transform:translateX(0)}50%,70%{transform:translateX(-100%)}100%{transform:translateX(0)}}리빌(언커버)은 새 화면이 **이미 아래에 깔려 있고** 기존 화면이 치워지는 전환입니다. 커버를 거꾸로 감은 것과 같아서, 모달을 닫을 때 쓰는 모션이 사실상 리빌입니다. 키노트에서는 "Reveal", 파워포인트에서는 "Uncover" 라고 부릅니다.
새 화면이 처음부터 제자리에 있으므로 사용자의 시선이 흔들리지 않고, "덮개를 열었더니 원래 있던 것이 나왔다"는 인상을 줍니다. 닫기·완료·되돌아가기 같은 **해소(resolve)** 의 의미와 잘 맞습니다.
와이프(→ wipe-transition)와 비슷해 보이지만, 와이프는 경계선이 새 화면을 **잘라서** 보여주고 리빌은 기존 화면 **전체가 이동**합니다.
모달·시트를 닫거나 작업을 마치고 원래 화면으로 돌아갈 때 쓰세요. 열 때는 커버, 닫을 때는 리빌이 짝입니다.