/* ── 逐梦航空 VI · 网页浏览版 ───────────────────── */
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { height: 100%; }
body {
  background: #14182b;
  font-family: 'Noto Sans SC', sans-serif;
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
}

#root { height: 100vh; }

.app {
  display: flex;
  height: 100vh;
  width: 100vw;
}

/* ── 左侧缩略图栏 ── */
.rail {
  width: 250px;
  flex: none;
  height: 100vh;
  overflow-y: auto;
  overflow-x: hidden;
  background: #0f1322;
  border-right: 1px solid rgba(255,255,255,.06);
  padding: 18px 14px 40px 16px;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.18) transparent;
}
.rail::-webkit-scrollbar { width: 8px; }
.rail::-webkit-scrollbar-thumb { background: rgba(255,255,255,.16); border-radius: 4px; }
.rail::-webkit-scrollbar-track { background: transparent; }

.thumb-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 14px;
  cursor: pointer;
}
.thumb-num {
  width: 16px;
  flex: none;
  text-align: right;
  font-family: 'Jost', sans-serif;
  font-size: 11px;
  line-height: 1;
  padding-top: 4px;
  color: rgba(255,255,255,.4);
  transition: color .2s;
}
.thumb-row.active .thumb-num { color: #C9AC72; }

.thumb {
  position: relative;
  width: 180px;
  height: 101.25px;          /* 16:9 */
  flex: none;
  border-radius: 4px;
  overflow: hidden;
  background: #1a1f36;
  border: 2px solid transparent;
  box-shadow: 0 2px 8px rgba(0,0,0,.35);
  transition: border-color .2s;
}
.thumb-row.active .thumb { border-color: #C9AC72; }
.thumb-row:hover .thumb { border-color: rgba(201,172,114,.5); }

/* 缩略图内部的 1920×1080 舞台，缩放填入 184px 宽 */
.thumb .stage {
  position: absolute;
  top: 0; left: 0;
  width: 1920px;
  height: 1080px;
  transform: scale(0.09375);   /* 180 / 1920 */
  transform-origin: top left;
  pointer-events: none;
}

/* ── 右侧主区域：连续顺滑滚动 ── */
.main {
  flex: 1;
  position: relative;
  height: 100vh;
  background:
    radial-gradient(120% 120% at 50% 0%, #1b2036 0%, #14182b 60%, #0f1322 100%);
  overflow-y: auto;
  overflow-x: hidden;
  scroll-behavior: smooth;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.18) transparent;
}
.main::-webkit-scrollbar { width: 10px; }
.main::-webkit-scrollbar-thumb { background: rgba(255,255,255,.16); border-radius: 5px; }
.main::-webkit-scrollbar-track { background: transparent; }

.scroll-pad { height: 48px; }

/* 每页：竖向排列、居中、留间隔 */
.slide-item {
  position: relative;
  margin: 0 auto 56px;
  background: #1a1f36;
  box-shadow: 0 30px 80px -34px rgba(0,0,0,.72);
  border-radius: 3px;
  overflow: hidden;
}
.slide-item .stage-scaled {
  position: absolute;
  top: 0; left: 0;
  width: 1920px;
  height: 1080px;
  transform-origin: top left;
}
.main .stage {
  position: absolute;
  top: 0; left: 0;
  width: 1920px;
  height: 1080px;
  overflow: hidden;
}

/* 幻灯片 section：填满舞台（替代 deck-stage 的 inset:0） */
.stage > section {
  position: absolute !important;
  inset: 0 !important;
  width: 1920px !important;
  height: 1080px !important;
  overflow: hidden;
}

/* 右下角页码（固定，跟随滚动） */
.pageno {
  position: fixed;
  right: 26px;
  bottom: 20px;
  font-family: 'Jost', sans-serif;
  font-size: 13px;
  letter-spacing: .18em;
  color: rgba(201,172,114,.6);
  user-select: none;
  pointer-events: none;
  z-index: 20;
}