/* 비행 장면 전용 최종 테마: 이전 색상 규칙보다 항상 우선한다. */
html, body, #app, #flight.screen, #flight.screen.active, #space {
  background: #0E0F37 !important;
  background-image: none !important;
}

#flight.screen {
  color: #eff6ff;
}

#space {
  /* 비행 화면은 어떤 상태에서도 보라색/누런색으로 바뀌지 않게 고정 */
  background-color: #0E0F37 !important;
  box-shadow: inset 0 0 0 1px #ffffff16;
}

/* hidden 속성보다 결과 오버레이의 display 규칙이 우선하지 않게 한다. */
#result-overlay[hidden] { display: none !important; }
.exit-mission { width: 100%; padding: 10px; border: 1px solid #ffffff42; border-radius: 13px; background: transparent; color: #d6e2ff; font-weight: 800; }
.exit-mission[hidden] { display: none; }

/* 은하 지도도 같은 우주색 바탕에서 실제 행성으로 보이게 한다. */
#galaxy {
  background: radial-gradient(circle at 50% 42%, #181c55 0%, #0E0F37 75%) !important;
}

#galaxy .map-planet { width: 138px; }
#galaxy .map-planet .map-world { width: 98px; height: 98px; }

/* 시작 전 학생 정보 입력창 */
.student-modal { position: fixed; z-index: 100; inset: 0; display: grid; place-items: center; padding: 20px; background: #0E0F37dd; }
.student-modal[hidden] { display: none; }
.student-form { width: min(100%, 390px); padding: 26px 22px; border: 1px solid #ffffff2a; border-radius: 22px; background: #171947; color: #eff6ff; box-shadow: 0 18px 45px #0009; }
.student-form h2 { margin: 7px 0; font-size: 25px; }
.student-form > p:not(.eyebrow) { margin: 0 0 20px; color: #c8d3f2; font-size: 14px; }
.student-form label { display: grid; gap: 7px; margin: 13px 0; font-weight: 800; font-size: 14px; }
#admin-password-row[hidden] { display: none !important; }
.student-form input { width: 100%; padding: 14px; border: 1px solid #7080ad; border-radius: 12px; outline: 0; background: #0E0F37; color: #fff; font: inherit; }
.student-form input:focus { border-color: #ffb26d; box-shadow: 0 0 0 3px #ff9b4b33; }
.student-form .main-btn { margin-top: 10px; }
.student-rank-preview { display: block; margin: 15px 0 3px; padding: 11px; border: 1px solid #ffb26d55; border-radius: 11px; color: #ffe0bd; background: #0E0F37; font-size: 13px; font-weight: 800; }
.ranking-card { position: absolute; z-index: 20; left: 50%; bottom: 13px; width: min(92%, 360px); max-height: 47%; overflow: auto; transform: translateX(-50%); padding: 10px 13px; border: 1px solid #ffffff38; border-radius: 13px; background: #0E0F37e8; color: #fff; text-align: left; box-shadow: 0 5px 16px #0008; }
.ranking-card strong, .ranking-card span, .ranking-card small { display: block; }
.ranking-card strong { font-size: 14px; }.ranking-card strong b { color: #ffbd70; font-size: 18px; }.ranking-card span { margin-top: 3px; color: #cbd7ff; font-size: 11px; }.ranking-card small { margin-top: 5px; color: #ffe0bd; font-size: 10px; }
.ranking-card ol { margin: 7px 0; padding: 0; list-style: none; }.ranking-card li { display: grid; grid-template-columns: 35px 1fr 58px; gap: 4px; padding: 2px 0; border-bottom: 1px solid #ffffff15; font-size: 11px; }.ranking-card li.me { color: #ffcf89; font-weight: 900; }.ranking-card li em { font-style: normal; text-align: right; }
.final-ranking { width: 100%; margin: 12px 0; padding: 14px; border: 1px solid #ffffff2b; border-radius: 18px; background: #0E0F37; }.final-ranking h3 { margin: 0 0 10px; color: #ffcf89; }.final-ranking ol { margin: 0; padding: 0; list-style: none; }.final-ranking li { display: grid; grid-template-columns: 34px 1fr; align-items: center; gap: 9px; min-height: 38px; padding: 5px 0; border-bottom: 1px solid #ffffff18; }.final-ranking li.me { color: #ffcf89; font-weight: 900; }.final-ranking .rank-badge { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 50%; background: #ffd34d; color: #2a230b; font-size: 13px; font-weight: 900; box-shadow: 0 2px 5px #0006; }.final-ranking small { display: block; margin-top: 10px; color: #ffd9af; }
