#app position:fixed로 스크롤 제어 구조 개선

🤖 436 in / 681 out / 1117 total tokens

모바일 웹앱의 스크롤 제어 방식을 정리했다. 기존엔 html과 body 각각에 overflow:hidden을 선언했는데, 이를 #app으로 집중시켰다.

#app에 position:fixed를 적용하니 뷰포트 고정이 더 확실해진다. body 배경은 투명으로 수정했고, 실제 콘텐츠 영역에서만 배경색이 보이도록 구조를 단순화했다. 100dvh 단위로 모바일 브라우저 주소창 높이 변화에도 대응했다.

#app {
  position: fixed;
  width: 100%;
  max-width: 390px;
  height: 100dvh;
  overflow: hidden;
  background: var(--surface);
}

2줄 줄었는데 동작은 더 깔끔해졌다. CSS도 가독성이 곧 유지보수다.