/* 모바일 최우선 적용 CSS */
@media screen and (max-width: 768px) {
    /* 1. 사이드바 완전 제거 */
    .global-sidebar,
    div.global-sidebar,
    aside.global-sidebar {
        display: none !important;
        visibility: hidden !important;
        width: 0 !important;
        height: 0 !important;
        overflow: hidden !important;
    }
    
    /* 2. 컨텐츠 영역 전체 사용 */
    .content-wrapper,
    div.content-wrapper {
        display: block !important;
        flex-direction: column !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 10px !important;
        margin: 0 !important;
    }
    
    .main-area,
    div.main-area {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    
    /* 3. 로또 컨테이너 모바일 최적화 */
    .lotto-container,
    div.lotto-container {
        width: 100vw !important;
        max-width: 100vw !important;
        margin: 0 !important;
        padding: 20px !important;
        box-sizing: border-box !important;
    }
    
    /* 4. 타이틀 크기 조정 */
    .lotto-title,
    h1.lotto-title {
        font-size: 24px !important;
        line-height: 1.3 !important;
        margin: 20px 0 !important;
    }
    
    /* 5. 로또볼 가로 스크롤 */
    .lotto-balls,
    div.lotto-balls {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        overflow-y: hidden !important;
        -webkit-overflow-scrolling: touch !important;
        width: 100% !important;
        padding: 10px 0 !important;
    }
    
    .lotto-ball,
	div.lotto-ball {
        min-width: 50px !important;
        width: 50px !important;
        height: 50px !important;
        flex: 0 0 auto !important;
        font-size: 22px !important;
        margin: 0 5px !important;
    }
    
    /* 6. 버튼 풀사이즈 */
    .generate-btn,
    button.generate-btn {
        display: block !important;
        width: calc(100% - 40px) !important;
        max-width: 100% !important;
        margin: 20px auto !important;
        padding: 16px !important;
        font-size: 18px !important;
    }
    
    /* 7. 헤더 간소화 */
    #header_top,
    #header_top .inner {
        height: auto !important;
        min-height: 50px !important;
    }
    
    #logo a {
        font-size: 20px !important;
    }
    
    /* 8. 네비게이션 */
    #gnb_1dul {
        display: flex !important;
        overflow-x: auto !important;
    }
    
    .gnb_1dli a {
        padding: 10px 15px !important;
        font-size: 14px !important;
    }
}

/* 더 작은 화면 */
@media screen and (max-width: 480px) {
    .lotto-title {
        font-size: 20px !important;
    }
    
    .lotto-ball {
        width: 50px !important;
        height: 50px !important;
        font-size: 20px !important;
    }
    
    .generate-btn {
        font-size: 16px !important;
    }
}