diff --git a/apps/site/design.md b/apps/site/design.md
index 4607976..27f855f 100644
--- a/apps/site/design.md
+++ b/apps/site/design.md
@@ -189,6 +189,33 @@ WebGL 게이트: `prefers-reduced-motion` 이면 **아예 시작하지 않는다
 `ResizeObserver` 로 캔버스를 따라가게 했다. `window.resize` 만 듣던 동안 히어로 높이 변화를
 놓쳐 배경이 화면의 3분의 2만 덮고 아래가 검게 비었다.
 
+## 패럴랙스 지도 (실측)
+
+깊이가 다른 층을 겹쳐 시차를 만든다. **한 층은 반드시 고정이다** —
+전부 움직이면 기준이 없어 그냥 흔들리는 페이지가 된다.
+
+| 자리 | 층 | 방식 | 실측 이동 |
+|---|---|---|---|
+| 히어로 배경 | 셰이더 흐름 필드 | `scroll(root)` | **+56px** ↓ |
+| 히어로 글자 | | `scroll(root)` | **−88px** ↑ (반대 방향) |
+| 파이프라인 | 게이트 씬(three.js) | `sticky` + 카메라 | 6단계를 통과 |
+| ㅤ└ 단계명 | | — | **0** 고정 |
+| ㅤ└ 산출물 | | `view()` | ±14px |
+| 재료 · 설치 · 프리플라이트 | 배경 사진 | `fixed` | **0 — 원경** |
+| 사례 | 배경 사진 | `drift` 0.4 | 이미지 높이의 28.6% |
+| 조판 | 종이 | `drift` 0.25 | −122px (근경) |
+| 재료 타일 | | `view()` | ±26 / ±58px |
+| 프리플라이트 항목 | | `view()` | 6 → 10px (뒤일수록 늦게) |
+| **수치** | | **없음** | 의도적 정지 |
+
+세 가지 깊이가 다 있다 — **원경**(fixed) · **중경**(drift) · **근경**(콘텐츠와 함께).
+종이를 원경으로 두지 않은 이유는 손에 닿는 거리의 재질이기 때문이다.
+
+모바일(390px)에서도 `fixed` 가 유지된다. `background-attachment: fixed` 를 안 쓴 덕이다.
+
+`prefers-reduced-motion` 에서는 게이트 씬이 아예 시작하지 않고, 고정 배경은
+`position: absolute` 로 흐름에 돌아가며, 모든 `view()` 애니메이션이 꺼진다.
+
 ## 모션 문법 — 섹션마다 다른 말
 
 같은 패럴랙스를 전부에 걸면 벽지다. 각 섹션의 주장을 움직임으로 옮겼다.