/* 기본 리셋 및 정렬 */
body {
    margin: 0; padding: 0; display: flex; flex-direction: column; align-items: center;
    justify-content: flex-start; padding-top: 4vh; min-height: 100vh;
    background-color: #222; background-image: url('../img/bgpattern.jpg'); 
    background-repeat: repeat; background-size: 400px 400px;
    overflow: hidden;
}

#game-wrapper {
    position: relative; transform-origin: top center;
    display: flex; flex-direction: column; align-items: center;
}

.controls {
    width: 1440px; display: flex; justify-content: flex-end;
    gap: 15px; margin-bottom: 15px; 
}

#music-btn {
    padding: 10px 25px; font-size: 16px; font-weight: bold; cursor: pointer;
    background-color: #ff71dd; color: white; border: none; border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.3); transition: 0.2s;
}
#music-btn:hover { background-color: #e65ec4; transform: translateY(-2px); }

#reset-btn {
    padding: 10px 25px; font-size: 16px; font-weight: bold; cursor: pointer;
    background-color: #8c7ae6; color: white; border: none; border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.3); transition: 0.2s;
}
#reset-btn:hover { background-color: #7158e2; transform: translateY(-2px); }

/* 💡 저장 버튼 스타일 추가 */
#save-btn {
    padding: 10px 25px; font-size: 16px; font-weight: bold; cursor: pointer;
    background-color: #00d2d3; color: white; border: none; border-radius: 8px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.3); transition: 0.2s;
}
#save-btn:hover { background-color: #01a3a4; transform: translateY(-2px); }

#game-board {
    width: 1440px; height: 900px; position: relative;
    background-image: url('../img/bg.png'); background-size: 1440px 900px;
    overflow: hidden; box-shadow: 0 0 15px rgba(0,0,0,0.8);
}

/* 파츠 공통 설정 */
.part, .fixed-part {
    position: absolute;
    user-select: none;
    -webkit-user-select: none; /* 💡 텍스트/이미지 선택 완벽 차단 */
    -webkit-user-drag: none; 
    touch-action: none; 
    
    /* 💡 [핵심!] 아이패드/모바일 꾹 누르기(메뉴 팝업) 완벽 방지 */
    -webkit-touch-callout: none; 
}
.part { cursor: grab; }
.part:active { cursor: grabbing; }
.fixed-part { pointer-events: none; }

#senku-body { left: 0px; top: 0px; }

.game-footer {
    width: 1440px; box-sizing: border-box; margin-top: 20px; border-radius: 15px; 
    display: flex; justify-content: space-between; flex-wrap: wrap; gap: 30px;
    padding: 20px 40px; background-color: #fff0f5; color: #444;
    border-top: 2px dashed #ffb6c1; font-size: 0.9rem; line-height: 1.6;
}

.footer-col { display: flex; flex-direction: column; gap: 8px; }
.project-info { flex: 1; min-width: 200px; }
.credit-info { flex: 2; min-width: 300px; }
.footer-title { margin: 0; font-size: 1.3rem; font-weight: 800; }
.footer-sub { margin: 0; margin-top: -5px; font-size: 0.85rem; line-height: 1.4; }
.footer-contact p { margin: 4px 0; }
.music-credit {
    margin-top: 12px; padding: 12px 16px; background-color: rgba(255, 255, 255, 0.7);
    border-radius: 12px; font-size: 0.85rem;
}
.music-credit a { display: inline-block; margin-top: 4px; color: #ff69b4; text-decoration: none; font-weight: 600; }
.music-credit a:hover { text-decoration: underline; }
.footer-copy { margin-top: 20px; font-size: 0.8rem; color: #999; }

/* =========================================
   캡처 전용 전체화면 (리디렉션 효과)
   ========================================= */
#capture-overlay {
    position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
    background-color: rgba(0, 0, 0, 0.85); z-index: 99999; 
    display: flex; flex-direction: column; justify-content: center; align-items: center;
    overflow-y: auto; /* 💡 패드에서 화면이 작을 때 스크롤이 가능하게 함 */
}

/* 💡 새로 추가된 래퍼 (이 덩어리 전체를 줄일 겁니다) */
#capture-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    transform-origin: center center;
    padding: 20px; /* 패드에서 너무 벽에 안 붙게 여백 줌 */
}

#capture-board {
    width: 800px; height: 680px; position: relative;
    background-image: url('../img/bg_capture.png'); background-size: 800px 680px;
    overflow: hidden; box-shadow: 0 0 25px rgba(0,0,0,1);
}

.hidden { display: none !important; }

#btn-back-edit {
    padding: 15px 35px; font-size: 1.1rem; font-weight: bold; cursor: pointer;
    background-color: #ff52d9; color: white; border: none; border-radius: 8px;
    box-shadow: 0 4px 10px rgba(255, 82, 217, 0.4); transition: 0.2s;
}
#btn-back-edit:hover { background-color: #ff38ce; transform: translateY(-3px); }