/** ⛳ GOLF STORY 4.0 - 통합 디자인 표준 (수정본) **/

:root { 
    --mint: #2ecc71;       /* 표준 민트 */
    --bg: #121212;         /* 🚩 바탕색: 다크 그레이 */
    --card: #25282b;       /* 🚩 박스색 */
    --line: #36393d;       /* 테두리 */
}

/* [1] 전역 초기화 및 기종별 자동 대응 */
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }

html, body { 
    margin: 0; padding: 0; width: 100%; height: 100%; 
    height: 100vh; /* 🚩 구형 브라우저 및 안드로이드 웹뷰 호환 방어 */
    height: 100dvh; /* 🚩 모바일 브라우저 주소창 높이 오차 방지 */
    background-color: #000; 
    display: flex; justify-content: center; 
    overflow-x: hidden; /* 가로 스크롤만 방지 */
}

.app-container { 
    width: 100vw; height: 100vh; 
    height: -webkit-fill-available; /* 🍎 애플(iOS) 웹킷 사파리 높이 오차 보정 */
    height: 100dvh; /* 🚩 동적 뷰포트 높이 적용 */
    max-width: 500px; 
    background-color: var(--bg); 
    position: relative; 
    display: flex; flex-direction: column; 
    overflow-y: auto; /* 🚩 콘텐츠가 길어지면 내부 스크롤이 정상 작동하도록 허용 */
    -webkit-overflow-scrolling: touch; /* 🍎 애플(iOS) 부드러운 스크롤 가속 */
}

/* [2] 공통 UI 요소 (제목, 버튼 등) */
.header { 
    padding: 60px 20px 10px; 
    display: block !important;  
}
.header-title { 
    font-size: 1.2rem;      
    font-weight: 800; 
    color: var(--mint);    
}
.section-label { 
    font-size: 0.75rem; 
    color: #42cc7a; 
    font-weight: 700; 
    margin: 25px 0 10px 10px; 
    letter-spacing: 1px; 
}
.btn-main-back { 
    cursor: pointer; 
    font-size: 24px; 
    color: var(--mint); 
    background: none; 
    border: none; 
    display: block !important; 
    margin-bottom: 10px;             
}