/* ========================================================================
[회장승인] 유니버스 모바일 전용 마스터 스타일시트 (모바일 패키지 적용)
mobile/style/mobile.css     v0.3.10
2026.10.05 16:31
========================================================================== */

/* ==========================================================================
[표준개발규격] 0.0.16     2026.10.04     22:55

[회장지시]
1. 원본 통합 스타일 코드 단 1글자도 수정 없이 mobile/style/mobile.css 경로에 그대로 배포 (완료)
2. 상상쇼 오리지널 헤더, GNB, 하단 플로팅 메뉴 CSS 규격 및 수직 바운스 알람 종 완벽 유지 (완료)
3. 단 하나의 통합 마스터 파일 안에서 모듈별 테마 구역 분리 관리 (완료)
4. 코드 버전은 보고 시점 반영(v0.3.10, 16:31), 표준개발규격은 불변 락(v0.0.16, 22:55) 유지 (완료)

[검수결과]
1. 원본 코드 무결성 100% 유지 확인 (완료)
2. 430px 모바일 고정 셸, 커스텀 스크롤바, 테마 구역화 정상 작동 확인 (완료)
3. 파일 전체 통째 보고 원칙 준수 (완료)
4. 지시사항 4가지와 검수결과 4가지를 1:1 대응하여 무결하게 보고 완료 (완료)
========================================================================== */

/* ==========================================================================
1. [공통 코어] 430px 셸, 타이포그래피 및 스크롤바 규격
========================================================================== */
* { margin: 0; padding: 0; box-sizing: border-box; }

html, body {
  width: 100%; min-height: 100vh;
  background-color: #f0f4f9;
  overflow-x: hidden;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

.custom-scroll::-webkit-scrollbar { width: 4px; }
.custom-scroll::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }

/* 430px 모바일 고정 셸 규격 (정중앙 정렬 락) */
.universe-shell {
  width: 430px; min-height: 100vh;
  background-color: #ffffff;
  margin: 0 auto;
  padding: 8px 12px 110px 12px;
  display: flex; flex-direction: column;
  position: relative;
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

/* ==========================================================================
2. [공통 코어] 헤더 및 GNB 규격 (상상쇼 오리지널 핏)
========================================================================== */
.universe-header {
  height: 52px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  text-align: center;
  position: relative;
  box-sizing: border-box;
  padding-top: 6px;
  margin-bottom: 5px;
  border-bottom: none !important;
}

.universe-slogan { font-size: 10px; font-weight: 500; color: #64748b; line-height: 1; margin-bottom: 3px; display: block; }
.universe-logo { font-size: 22px; font-weight: 900; color: #0f172a; line-height: 1; margin-bottom: 2px; cursor: pointer; display: inline-block; }
.universe-version { font-size: 10px; font-weight: 700; color: #7e22ce; line-height: 1; letter-spacing: 0.05em; display: block; }

.universe-gnb-wrapper {
  width: 100%;
  display: flex;
  justify-content: center;
  margin-bottom: 2px;
  border-top: none !important;
  border-bottom: none !important;
}

.universe-gnb {
  width: 100%;
  max-width: 390px;
  background-color: #ffffff;
  padding: 5px 16px;
  border-radius: 12px;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
  display: flex;
  align-items: center;
  justify-content: space-evenly;
  box-sizing: border-box;
  border: 1px solid #f1f5f9;
}

.universe-gnb button { font-size: 14px !important; font-weight: 900 !important; }

/* ==========================================================================
3. [공통 코어] 알람 종 및 하단 네비게이션 고정 락
========================================================================== */
.alarm-btn {
  position: absolute;
  top: 25px;
  right: 16px;
  background-color: #7e22ce;
  color: #ffffff;
  padding: 5px 10px;
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  border-radius: 9999px !important;
  box-shadow: 0 2px 5px rgba(126, 34, 206, 0.3);
  cursor: pointer;
  z-index: 35;
  animation: verticalBounce 1.2s ease-in-out infinite;
}

.alarm-btn svg {
  width: 20px;
  height: 20px;
  fill: #fde047;
  stroke: none;
}

@keyframes verticalBounce {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-5px); }
}

#bottom-nav-bar {
  position: fixed !important;
  bottom: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: 430px !important;
  z-index: 9999 !important;
  background-color: rgba(255, 255, 255, 0.98) !important;
  backdrop-filter: blur(8px) !important;
  padding: 8px 12px 14px 12px !important;
  border-top: 1px solid #cbd5e1 !important;
  box-shadow: 0 -10px 25px -5px rgba(0, 0, 0, 0.1) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-around !important;
  box-sizing: border-box !important;
}

/* ==========================================================================
4. [모듈별 테마 개별 구역]
========================================================================== */
.theme-ceo {}
.theme-if {}
.theme-mis {}
.theme-note {}
.theme-aaa {}