/* 전체 페이지 배경색 */
body {
    font-family: 'Noto Sans KR', sans-serif;
    background-color: #F3F4F6;
}

.font-handwriting {
    font-family: 'Nanum Pen Script', cursive;
}

/* 앱 콘텐츠를 감싸는 메인 컨테이너 */
.app-container {
    width: 100%;
    background-color: #FBF8F3;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* 데스크톱 화면 (768px 이상) 에서 적용될 스타일 */
@media (min-width: 768px) {
    .app-container {
        /* [수정] 기본 너비를 더 넓게 설정 */
        max-width: 768px; 
        margin: 2rem auto;
        border-radius: 20px;
        box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
        overflow: hidden;
    }
}

/* 더 큰 데스크톱 화면 (1024px 이상) 에서 적용될 스타일 */
@media (min-width: 1024px) {
    .app-container {
        /* [추가] 더 넓은 화면에서는 더 넓게 보이도록 설정 */
        max-width: 1024px;
    }
}

main {
    flex-grow: 1;
    overflow-y: auto;
}

main::-webkit-scrollbar {
    display: none;
}
