body {
    background-color: #222; /* 어두운 배경으로 무대 집중 */
    color: white;
    font-family: 'Noto Sans KR', sans-serif;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    margin: 0;
}

.stage-container {
    width: 90%;
    max-width: 1000px;
    text-align: center;
}

/* 무대 전체 영역 (비율 유지) */
.pit {
    position: relative;
    width: 100%;
    padding-bottom: 60%; /* ~16:9 비율 */
    background: radial-gradient(circle at 50% 100%, #555, #333); /* 은은한 조명 */
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}

/* --- 무대 단상 (부채꼴 라인) --- */
.row {
    position: absolute;
    border-top: 2px solid rgba(255,255,255,0.1);
    border-radius: 50% 50% 0 0 / 100% 100% 0 0; /* 반원 */
    left: 50%;
    transform: translateX(-50%);
    box-shadow: inset 0 5px 15px rgba(0,0,0,0.2);
}

.row-1 { bottom: 0; width: 140%; height: 90%; background-color: rgba(255,255,255,0.02); }
.row-2 { bottom: 0; width: 110%; height: 65%; background-color: rgba(255,255,255,0.04); }
.row-3 { bottom: 0; width: 80%;  height: 40%; background-color: rgba(255,255,255,0.06); }

/* --- 악기 공통 스타일 --- */
.instrument {
    position: absolute;
    width: 8%; /* 화면 크기에 비례 */
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    z-index: 10;
}

/* SVG 아이콘 */
.instrument-icon {
    width: 100%;
    height: auto;
    filter: drop-shadow(0 5px 5px rgba(0,0,0,0.5)); /* 그림자 */
    transition: filter 0.3s;
}

/* 호버링 효과 */
.instrument:hover {
    transform: scale(1.3) translateY(-10px);
    z-index: 20;
}

.instrument:hover .instrument-icon {
    filter: drop-shadow(0 15px 10px rgba(255, 215, 0, 0.4)); /* 금빛 후광 */
}

/* 클릭 후 활성 상태(선택됨) */
.instrument.active {
    transform: scale(1.25) translateY(-8px);
    z-index: 25;
}

/* --- 각 악기 위치 --- */
/* 제1 바이올린 (왼쪽 앞) */
.v-1 { bottom: 25%; left: 20%; }

/* 첼로 (오른쪽 앞) */
.cello { bottom: 25%; left: 70%; }

/* 피아노 (왼쪽 뒤, 좀 더 크게) */
.piano { bottom: 50%; left: 15%; width: 12%; }

/* 지휘자 (맨 앞 중앙, 조금 더 작게) */
.conductor { bottom: 5%; left: 46%; width: 6%; }

/* --- 툴팁 --- */
.tooltip {
    position: absolute;
    bottom: -30px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0,0,0,0.8);
    color: #fff;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    white-space: nowrap;
    opacity: 0;
    transition: opacity 0.3s;
    pointer-events: none;
}

.instrument:hover .tooltip {
    opacity: 1;
}

/* 하단 정보 박스 */
#info-box {
    margin-top: 20px;
    font-size: 1.2rem;
    color: #ddd;
    min-height: 30px;
    text-align: center;
}