/* ============================================================
 * features.css — 在轨目录 / 时间轴 / 音乐 / 名言 / 开场 / 模拟
 * ============================================================ */

/* ---------- 视图弹层扩展 ---------- */
.view-arrange { display: flex; gap: 4px; margin-bottom: 8px; }
.view-arrange .opt-btn { justify-content: center; font-size: 11px; padding: 0 2px; }
.slider-row {
  display: flex; align-items: center; gap: 8px;
  font-size: 11px; color: var(--text-dim); padding: 6px 2px 2px;
}
.slider-row span { flex: none; }
.slider-row input[type="range"] {
  flex: 1; min-width: 0; -webkit-appearance: none; appearance: none; height: 3px; border-radius: 2px;
  background: rgba(120, 170, 255, 0.25); outline: none; cursor: var(--cur-hot);
}
.slider-row input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none; width: 11px; height: 11px; border-radius: 50%;
  background: var(--accent); border: none;
}

/* ---------- FX 弹层通用 ---------- */
.fx-panel { width: 250px; }
.panel-note { font-size: 10px; line-height: 1.7; color: var(--text-faint); margin-top: 8px; }

/* ---------- 在轨目录 ---------- */
#catalog-panel {
  top: 60px; left: 16px; right: auto;
  width: 292px; max-height: calc(100vh - 120px);
  display: flex; flex-direction: column;
}
.catalog-search { position: relative; margin-bottom: 8px; }
.catalog-search .icon {
  position: absolute; left: 9px; top: 50%; transform: translateY(-50%);
  font-size: 12px; color: var(--text-faint); pointer-events: none;
}
.catalog-search input {
  width: 100%; height: 30px; border-radius: 8px; border: 1px solid var(--border);
  background: rgba(10, 18, 34, 0.6); color: var(--text); font-size: 12px;
  font-family: inherit; padding: 0 10px 0 26px; outline: none; box-sizing: border-box;
}
.catalog-search input:focus { border-color: var(--border-hi); }
.chip-row { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 8px; }
.chip {
  border: 1px solid var(--border); background: rgba(20, 32, 56, 0.45); color: var(--text-dim);
  font-size: 10px; font-family: inherit; border-radius: 20px; padding: 3px 9px; cursor: var(--cur-hot);
  transition: all 0.15s ease; letter-spacing: 0.05em;
}
.chip:hover { color: var(--text); border-color: var(--border-hi); }
.chip.active { background: var(--accent-soft); color: #fff; border-color: var(--border-hi); }
#catalog-list { flex: 1; overflow-y: auto; min-height: 0; }
.cat-item {
  padding: 7px 8px; border-radius: 8px; cursor: var(--cur-hot); transition: background 0.12s ease;
  border-bottom: 1px solid rgba(120, 170, 255, 0.06);
}
.cat-item:hover { background: rgba(90, 167, 255, 0.10); }
.cat-item.active { background: var(--accent-soft); box-shadow: inset 0 0 0 1px rgba(90, 167, 255, 0.28); }
.cat-item .n1 { font-size: 12px; color: var(--text); }
.cat-item .n2 { font-size: 10px; color: var(--text-faint); letter-spacing: 0.04em; margin-top: 2px; }
.cat-item .yr { float: right; font-size: 10px; color: var(--accent); font-family: Consolas, monospace; }
.cat-status {
  display: inline-block; font-size: 8px; letter-spacing: 0.1em; border-radius: 4px;
  padding: 1px 5px; margin-left: 6px; vertical-align: 1px; border: 1px solid var(--border);
}
.cat-status.ACTIVE { color: #7fe0a0; border-color: rgba(127, 224, 160, 0.4); }
.cat-status.COMPLETED { color: #9db2d0; border-color: rgba(157, 178, 208, 0.35); }
.cat-status.IN_FLIGHT { color: #f5d47f; border-color: rgba(245, 212, 127, 0.4); }
/* z206：在轨目录 TLE 抽屉 */
.cat-sec-title { font-size: 10px; letter-spacing: 0.14em; color: var(--accent); margin: 10px 0 5px; }
.cat-drawer, .cat-subdrawer {
  display: flex; align-items: center; gap: 6px; cursor: var(--cur-hot);
  padding: 6px 8px; border-radius: 8px; margin: 2px 0;
  background: rgba(90, 167, 255, 0.05); border: 1px solid rgba(120, 170, 255, 0.10);
  font-size: 11px; color: var(--text); transition: background 0.12s ease;
  user-select: none;
}
.cat-drawer:hover, .cat-subdrawer:hover { background: rgba(90, 167, 255, 0.12); }
.cat-subdrawer { margin-left: 14px; background: rgba(90, 167, 255, 0.03); font-size: 10.5px; }
.cat-tri { margin-left: auto; color: var(--accent); font-size: 10px; }
.cat-subdrawer .pdot { width: 6px; height: 6px; border-radius: 50%; flex: none; box-shadow: 0 0 5px currentColor; }
.cat-item.tle .n1 { font-family: Consolas, monospace; }
/* z206：统一时间选择器 */
.tp-panel { left: 50%; transform: translateX(-50%); bottom: 64px; display: none; width: 300px; }
.tp-panel.open { display: block; }
.tp-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 10px 0 12px; }
.tp-grid label { display: flex; flex-direction: column; gap: 4px; font-size: 10px; letter-spacing: 0.1em; color: #8fa3c0; }
.tp-grid input {
  background: rgba(10, 16, 28, 0.7); border: 1px solid rgba(120, 170, 255, 0.22);
  color: var(--text, #dfe7f5); border-radius: 6px; padding: 6px 8px;
  font-size: 13px; width: 100%; box-sizing: border-box; font-family: Consolas, monospace;
}
.tp-grid input:focus { outline: none; border-color: rgba(120, 170, 255, 0.55); }
.tp-btns { display: flex; gap: 8px; }
.tp-btn {
  flex: 1; padding: 8px 0; border-radius: 8px; cursor: var(--cur-hot);
  border: 1px solid rgba(120, 170, 255, 0.25); background: rgba(90, 167, 255, 0.08);
  color: var(--text, #dfe7f5); font-size: 12px; transition: background 0.12s ease;
}
.tp-btn:hover { background: rgba(90, 167, 255, 0.18); }
.tp-btn.primary { background: rgba(90, 167, 255, 0.28); border-color: rgba(120, 170, 255, 0.45); }
#date-text { cursor: var(--cur-hot); }

/* ---------- 时间轴 ---------- */
#timeline-panel {
  top: auto; right: auto; bottom: 118px; left: 50%; transform: translate(-50%, -6px);
  width: 880px; max-width: calc(100vw - 32px);
}
#timeline-panel.open { transform: translate(-50%, 0); }
#timeline-canvas { width: 100%; height: auto; display: block; border-radius: 8px; cursor: var(--cur-hot); touch-action: none; }
#timeline-canvas.grabbing { cursor: var(--cur-hot); }

/* ---------- Toast 提示 ---------- */
#fx-toast {
  position: fixed; top: 64px; left: 50%; transform: translate(-50%, -8px);
  z-index: 55; max-width: 60vw; padding: 9px 18px;
  background: rgba(12, 22, 42, 0.88); border: 1px solid var(--border-hi); border-radius: 20px;
  color: var(--text); font-size: 12px; letter-spacing: 0.05em;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.5);
  opacity: 0; pointer-events: none; transition: opacity 0.25s ease, transform 0.25s ease;
}
#fx-toast.show { opacity: 1; transform: translate(-50%, 0); }

/* ---------- 实时模式：锁定时间控件 ---------- */
#time-bar.live-lock .t-btn, #time-bar.live-lock #speed-select { opacity: 0.4; pointer-events: none; }
#time-bar.live-lock #today-btn { opacity: 1; pointer-events: auto; }

/* ---------- 图谱/三维：底部任务时间带命中条 ---------- */
body.view-atlas #time-bar { bottom: auto; }
#timeline-strip {
  display: none;
  position: fixed; left: 0; right: 0; bottom: 0;
  height: 56px; z-index: 15;
  cursor: var(--cur-hot); touch-action: none;
}
#timeline-strip:active { cursor: var(--cur-hot); }
body.has-timeline #timeline-strip { display: block; }
.timeline-tip { font-size: 10px; color: var(--text-faint); margin: 6px 2px 8px; letter-spacing: 0.05em; text-align: right; }
.timeline-foot { display: flex; align-items: center; gap: 12px; }
.timeline-foot .opt-btn { width: auto; padding: 0 14px; margin-bottom: 0; flex: none; }
.stats-row { display: flex; gap: 14px; flex-wrap: wrap; }
.stat { display: flex; flex-direction: column; }
.stat .v { font-size: 15px; color: var(--text); font-family: Consolas, monospace; }
.stat .k { font-size: 9px; color: var(--text-faint); letter-spacing: 0.1em; margin-top: 1px; }

/* ---------- 音乐 / 数据来源 ---------- */
#music-panel .track-btn span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; }
.data-text p { font-size: 11px; line-height: 1.8; color: var(--text-dim); margin: 0 0 8px; }

/* ---------- 手机小屏：FX 弹层统一底部卡片 + 触控字号 ---------- */
@media (max-width: 640px) {
  .fx-panel, #catalog-panel, .sat-panel { width: auto !important; }
  .fx-panel { max-height: 58vh; overflow-y: auto !important; }
  .catalog-search input { height: 34px; font-size: 12.5px; }
  .chip { font-size: 11px; padding: 5px 11px; }
  .opt-btn { font-size: 12px; min-height: 32px; }
  .panel-note { font-size: 11px; }
  .data-text p { font-size: 12px; }
  .stat .v { font-size: 14px; }
  .stat .k { font-size: 10px; }
  .timeline-tip { font-size: 11px; }
  .mi-item, .sat-item, .track-row { min-height: 34px; }
  #fx-toast { max-width: 92vw; font-size: 12.5px; }
  /* 时间轴面板：840px 画布压到卡片宽度内 */
  #timeline-panel canvas { max-width: 100% !important; height: auto !important; }
  .sat-panel { max-height: 56vh; overflow-y: auto; }
  /* 名言/开场在手机上让位 */
  #quote-bar { display: none; }
  /* 名言隐藏时角标回退左下角（1240px 断点同理由 style.css 侧栏上移接管） */
  #hq-pack { top: auto; bottom: 16px; left: 16px; }
}

/* ---------- 面板自由摆放：拖动 / 缩放 / 自适应滚动 ---------- */
.panel {
  display: flex; flex-direction: column; box-sizing: border-box;
  overflow: visible;
}
.panel .panel-head {
  cursor: var(--cur-hot); touch-action: none; flex: none;
  user-select: none; -webkit-user-select: none;
}
.panel.dragging, .panel.resizing { transition: none !important; }
.panel.dragging { user-select: none; -webkit-user-select: none; }
.panel-body {
  flex: 1 1 auto; min-height: 0;
  overflow-y: auto; overflow-x: hidden;
}
.panel-resize {
  position: absolute; width: 18px; height: 18px;
  z-index: 3; touch-action: none; opacity: 0.45;
  transition: opacity 0.15s ease;
}
.panel-resize:hover { opacity: 1; }
.panel-resize::before {
  content: ''; position: absolute; width: 8px; height: 8px;
  border: 2px solid var(--border-hi); border-radius: 2px;
}
.panel-resize.pr-se { right: 2px; bottom: 2px; cursor: nwse-resize; }
.panel-resize.pr-sw { left: 2px; bottom: 2px; cursor: nesw-resize; }
.panel-resize.pr-ne { right: 2px; top: 2px; cursor: nesw-resize; }
.panel-resize.pr-nw { left: 2px; top: 2px; cursor: nwse-resize; }
.panel-resize.pr-se::before { right: 3px; bottom: 3px; border-left: none; border-top: none; }
.panel-resize.pr-sw::before { left: 3px; bottom: 3px; border-right: none; border-top: none; }
.panel-resize.pr-ne::before { right: 3px; top: 3px; border-left: none; border-bottom: none; }
.panel-resize.pr-nw::before { left: 3px; top: 3px; border-right: none; border-bottom: none; }
body.panel-resizing { user-select: none; -webkit-user-select: none; cursor: inherit; }
/* 目录面板：保持列表内滚，外层不重复滚动 */
#catalog-panel .panel-body { display: flex; flex-direction: column; overflow-y: hidden; }

/* ---------- 公网完整包下载角标（左上角：名言栏正下方，侧栏上方的空档区） ---------- */
#hq-pack {
  position: fixed; left: 44px; top: 92px; z-index: 40;
  width: 240px; padding: 9px 12px 10px; box-sizing: border-box;
  background: rgba(12, 22, 42, 0.88); border: 1px solid var(--border-hi); border-radius: 12px;
  cursor: var(--cur-hot); user-select: none; -webkit-user-select: none;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.45);
  transition: opacity 0.8s ease, transform 0.8s ease;
}
#hq-pack .hq-row { display: flex; align-items: center; gap: 7px; font-size: 11px; color: var(--text-dim); letter-spacing: 0.04em; }
#hq-pack .hq-ico { color: var(--accent); font-size: 12px; flex: none; animation: hq-pulse 1.6s ease-in-out infinite; }
#hq-pack .hq-txt { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#hq-pack .hq-pct { flex: none; font-family: Consolas, monospace; color: var(--text); }
#hq-pack .hq-bar { margin-top: 7px; height: 3px; border-radius: 2px; background: rgba(120, 170, 255, 0.18); overflow: hidden; }
#hq-pack .hq-bar i { display: block; height: 100%; width: 0; border-radius: 2px; background: linear-gradient(90deg, #5aa7ff, #8fd0ff); transition: width 0.3s ease; }
@keyframes hq-pulse { 50% { opacity: 0.35; } }
#hq-pack.min .hq-bar { display: none; }
#hq-pack.done { border-color: rgba(127, 224, 160, 0.4); }
#hq-pack.done .hq-ico { animation: none; color: #7fe0a0; }
#hq-pack.done .hq-bar i { background: #7fe0a0; }
#hq-pack.gone { opacity: 0; transform: translateY(8px); pointer-events: none; }
/* ≤1240px：名言栏隐藏、侧栏上移，角标回左下角避让 */
@media (max-width: 1240px) {
  #hq-pack { top: auto; bottom: 16px; left: 16px; }
}

/* ---------- 名言（左上角：时间栏正下方，侧栏上方的空档区） ---------- */
#quote-bar {
  position: fixed; top: 64px; left: 44px; transform: none;
  z-index: 12; pointer-events: none; text-align: left;
  display: flex; align-items: baseline; gap: 10px; max-width: 40vw;
  opacity: 0.85; transition: opacity 1.6s ease;
}
#quote-bar.faded { opacity: 0; }
#quote-text { font-size: 14px; color: var(--text-dim); letter-spacing: 0.06em; }
#quote-person { font-size: 12px; color: var(--text-faint); flex: none; letter-spacing: 0.1em; }

/* ---------- 开场 intro（深空蓝色调，与全局 HUD 统一） ---------- */
#intro {
  position: fixed; inset: 0; z-index: 60;
  background: radial-gradient(ellipse at 50% 40%, rgba(14, 26, 50, 0.92) 0%, rgba(4, 6, 12, 0.985) 66%);
  display: flex; align-items: center; justify-content: center;
  opacity: 1; transition: opacity 0.9s ease;
}
#intro.hide { opacity: 0; pointer-events: none; }
.intro-inner { text-align: center; max-width: 640px; padding: 0 24px; }
.intro-kicker { font-size: 10px; letter-spacing: 0.5em; text-indent: 0.5em; color: #7fb4e8; margin-bottom: 26px; }
.intro-title {
  font-size: 52px; font-weight: 600; letter-spacing: 0.22em; text-indent: 0.22em;
  color: #eaf2ff; margin: 0 0 14px; cursor: var(--cur-hot); text-shadow: 0 0 46px rgba(90, 167, 255, 0.38);
}
.intro-title .caret { display: inline-block; width: 2px; height: 0.9em; background: #7fb4e8; vertical-align: -0.08em; margin-left: 4px; animation: caret-blink 0.9s step-end infinite; }
@keyframes caret-blink { 50% { opacity: 0; } }
.intro-sub { font-size: 12px; letter-spacing: 0.28em; color: rgba(190, 214, 248, 0.75); margin-bottom: 20px; }
.intro-desc { font-size: 13px; line-height: 2; color: rgba(186, 208, 240, 0.82); margin: 0 0 30px; }
.intro-stats {
  display: flex; justify-content: center; gap: 44px;
  border-top: 1px solid rgba(122, 178, 255, 0.20);
  padding-top: 20px; margin-bottom: 36px;
}
.intro-stats .is-item { display: flex; flex-direction: column; align-items: center; }
.intro-stats .is-v { font: 600 20px/1.2 Consolas, monospace; color: #9fc6ff; letter-spacing: 0.06em; }
.intro-stats .is-k { font-size: 9px; letter-spacing: 0.3em; color: rgba(150, 180, 225, 0.65); margin-top: 5px; }
.intro-btns { display: flex; gap: 14px; justify-content: center; margin-bottom: 40px; }
.intro-btns button {
  height: 40px; padding: 0 30px; border-radius: 20px; cursor: var(--cur-hot);
  font-size: 13px; letter-spacing: 0.2em; font-family: inherit;
  transition: all 0.2s ease;
}
#intro-enter {
  border: 1px solid rgba(122, 178, 255, 0.65);
  background: linear-gradient(135deg, rgba(18, 40, 74, 0.92), rgba(28, 64, 112, 0.92));
  color: #cfe4ff;
  box-shadow: 0 4px 22px rgba(90, 167, 255, 0.26), inset 0 0 18px rgba(122, 178, 255, 0.10);
}
#intro-enter:hover { transform: translateY(-1px); border-color: #5aa7ff; color: #eaf5ff; box-shadow: 0 6px 28px rgba(90, 167, 255, 0.50), inset 0 0 24px rgba(122, 178, 255, 0.18); }
#intro-skip { border: 1px solid rgba(120, 150, 195, 0.35); background: transparent; color: rgba(190, 210, 240, 0.7); }
#intro-skip:hover { color: #cfe4ff; border-color: rgba(122, 178, 255, 0.5); }
.intro-hint { font-size: 10px; letter-spacing: 0.18em; color: rgba(140, 165, 205, 0.55); }

/* ---------- 任务标记 / 标签 ---------- */
.mission-label {
  font-size: 9px; color: #b9c8e2; letter-spacing: 0.08em; white-space: nowrap;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9); pointer-events: auto; cursor: var(--cur-hot);
  padding-left: 10px; position: relative; transition: color 0.15s ease;
}
.mission-label::before {
  content: ''; position: absolute; left: 2px; top: 50%; transform: translateY(-50%);
  width: 4px; height: 4px; border-radius: 50%; background: #8fd0ff; box-shadow: 0 0 5px #8fd0ff;
}
.mission-label:hover { color: #fff; }
.comet-label {
  font-size: 10px; color: #aee6ff; letter-spacing: 0.1em; white-space: nowrap;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9); pointer-events: auto; cursor: var(--cur-hot);
  padding-left: 11px; position: relative;
}
.comet-label::before {
  content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%);
  width: 5px; height: 5px; border-radius: 50%; background: #bfeaff; box-shadow: 0 0 8px #bfeaff;
}
.comet-label:hover { color: #fff; }

/* ---------- 覆盖层退出按钮（深空右上角，居中 HUD 之外不与其它元素打架） ---------- */
.ov-exit {
  position: absolute; top: 14px; right: 16px; z-index: 5;
  pointer-events: auto;
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  padding: 7px 16px 6px;
  background: rgba(14, 22, 38, 0.72); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(150, 180, 225, 0.35); border-radius: 9px;
  color: #dfe9ff; font-size: 13px; letter-spacing: 0.12em; cursor: var(--cur-hot);
  transition: background 0.15s ease, border-color 0.15s ease;
}
.ov-exit span { font-size: 10px; letter-spacing: 0.06em; color: rgba(170, 195, 235, 0.65); }
.ov-exit:hover { background: rgba(70, 105, 165, 0.45); border-color: rgba(180, 210, 255, 0.6); }

/* ---------- 深空天图（SKY） ---------- */
#sky-overlay {
  position: fixed; inset: 0; z-index: 40;
  visibility: hidden; opacity: 0; pointer-events: none;
  background: #01020a;
  transition: opacity 0.4s ease, visibility 0s linear 0.4s;
}
#sky-overlay.open {
  visibility: visible; opacity: 1; pointer-events: auto;
  transition: opacity 0.4s ease;
}
#sky-gl {
  position: absolute; inset: 0; width: 100%; height: 100%;
  display: block; pointer-events: none; z-index: 0;
}
#sky-canvas { position: relative; width: 100%; height: 100%; display: block; z-index: 1; }
#sky-tip {
  position: absolute; left: 50%; bottom: 40px; transform: translateX(-50%);
  font-size: 11px; color: rgba(200, 215, 245, 0.55); letter-spacing: 0.14em;
  font-family: Consolas, monospace; pointer-events: none;
}
#sky-statusbar {
  position: absolute; left: 22px; bottom: 14px;
  display: flex; gap: 18px; align-items: baseline;
  font-family: Consolas, monospace; font-size: 11px; letter-spacing: 0.08em;
  color: rgba(170, 195, 230, 0.78); white-space: nowrap;
  padding: 5px 16px; border-radius: 8px;
  background: rgba(6, 12, 28, 0.55);
  border: 1px solid rgba(110, 150, 210, 0.18);
  pointer-events: none; backdrop-filter: blur(4px);
}
#sky-statusbar span b { color: rgba(225, 238, 255, 0.92); font-weight: 600; }
/* z227：观测地点段（Stellarium 左下角地点栏式）——可点击弹出选择面板 */
#sky-st-geo {
  pointer-events: auto; cursor: var(--cur-hot);
  color: rgba(200, 222, 250, 0.9);
  padding-right: 14px; border-right: 1px solid rgba(110, 150, 210, 0.22);
}
#sky-st-geo:hover { color: #bfe0ff; }
#sky-st-geo .sky-geo-pin { color: #7fc0ff; margin-right: 2px; }
#sky-geo {
  position: absolute; left: 22px; bottom: 54px; z-index: 8;
  width: 240px; padding: 10px 14px 12px; border-radius: 12px;
  background: rgba(8, 14, 30, 0.94); border: 1px solid rgba(120, 160, 230, 0.25);
  backdrop-filter: blur(10px); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
}
#sky-geo[hidden] { display: none; }
#sky-geo-title { font-size: 10px; letter-spacing: 0.16em; color: rgba(150, 200, 255, 0.75); margin-bottom: 7px; }
#sky-geo-search, #sky-geo-lat, #sky-geo-lon {
  width: 100%; height: 26px; border-radius: 7px; border: 1px solid rgba(120, 160, 230, 0.28);
  background: rgba(10, 18, 34, 0.6); color: #dceaff; font-size: 11px;
  font-family: inherit; padding: 0 8px; outline: none; box-sizing: border-box; margin-bottom: 6px;
}
#sky-geo-search:focus, #sky-geo-lat:focus, #sky-geo-lon:focus { border-color: rgba(130, 180, 255, 0.6); }
#sky-geo-list {
  max-height: 240px; overflow-y: auto; margin-bottom: 6px;
  scrollbar-width: thin; scrollbar-color: rgba(120, 160, 230, 0.35) transparent;
}
.sky-geo-item {
  display: flex; align-items: center; gap: 6px; padding: 4px 6px; border-radius: 6px;
  font-size: 11.5px; color: rgba(215, 232, 255, 0.85); cursor: var(--cur-hot);
  border-bottom: 1px solid rgba(120, 170, 255, 0.05);
}
.sky-geo-item:hover { background: rgba(90, 167, 255, 0.1); color: #eaf3ff; }
.sky-geo-item.sel { background: rgba(90, 167, 255, 0.16); color: #fff; }
.sky-geo-item span { flex: 1; }
.sky-geo-item i {
  font-style: normal; font-family: Consolas, monospace; font-size: 9.5px;
  color: rgba(160, 195, 240, 0.6); flex: none;
}
.sky-geo-none { font-size: 10px; color: rgba(170, 195, 230, 0.5); padding: 6px 2px; }
.sky-geo-custom { display: flex; gap: 5px; align-items: center; padding-top: 6px; border-top: 1px solid rgba(120, 160, 230, 0.14); }
.sky-geo-custom input { flex: 1; margin-bottom: 0 !important; min-width: 0; }
#sky-geo-go {
  height: 26px; padding: 0 11px; border-radius: 7px; flex: none; cursor: pointer;
  border: 1px solid rgba(120, 160, 230, 0.35); background: rgba(47, 111, 216, 0.3);
  color: #cfe4ff; font-size: 11px; font-family: inherit;
}
#sky-geo-go:hover { background: rgba(47, 111, 216, 0.5); }
#sky-title {
  position: absolute; left: 22px; top: 16px; font-size: 13px; letter-spacing: 0.3em;
  color: rgba(220, 232, 255, 0.85); font-family: inherit; pointer-events: none;
}

/* ---------- TLE 卫星工具面板 ---------- */
.sat-panel { width: 296px; max-height: calc(100vh - 130px); display: flex; flex-direction: column; }
.sat-tabs { display: flex; gap: 4px; margin-bottom: 8px; }
.sat-tab {
  flex: 1; height: 26px; border-radius: 7px; border: 1px solid var(--border);
  background: rgba(20, 32, 56, 0.45); color: var(--text-dim); font-size: 11px;
  font-family: inherit; cursor: var(--cur-hot); transition: all 0.15s ease;
}
.sat-tab:hover { color: var(--text); }
.sat-tab.active { background: var(--accent-soft); color: #fff; border-color: var(--border-hi); }
.sat-status { min-height: 16px; font-size: 10px; color: #7fe0a0; margin-bottom: 4px; letter-spacing: 0.03em; }
.sat-status.err { color: #ff9d8f; }
/* z233：对照表导入进度条（sat-status 下方细条） */
#tle-progress {
  height: 5px; border-radius: 3px; overflow: hidden; margin: 0 0 6px;
  background: rgba(10, 18, 34, 0.7); border: 1px solid rgba(120, 160, 230, 0.25);
}
#tle-progress[hidden] { display: none; }
#tle-progress-bar {
  height: 100%; width: 0%;
  background: linear-gradient(90deg, rgba(90, 167, 255, 0.85), rgba(111, 224, 168, 0.9));
  transition: width 0.25s ease;
  box-shadow: 0 0 6px rgba(90, 167, 255, 0.4);
}
/* z233：组内排序按钮（星座组标题行，数量旁） */
.const-sort {
  flex: none; cursor: var(--cur-hot);
  font-size: 10px; color: var(--text-faint);
  padding: 1px 4px; border-radius: 5px;
  border: 1px solid rgba(120, 170, 255, 0.18);
  font-family: Consolas, monospace;
  transition: all 0.15s ease;
  line-height: 1.2;
}
.const-sort:hover {
  color: #bfe0ff;
  border-color: rgba(130, 180, 255, 0.55);
  background: rgba(90, 167, 255, 0.1);
}
.sat-page { overflow-y: auto; min-height: 0; }
.sat-sec-title { font-size: 10px; letter-spacing: 0.14em; color: var(--accent); margin: 10px 0 5px; }
.sat-count { color: var(--text-faint); letter-spacing: 0; }
.sat-row { display: flex; gap: 5px; margin-bottom: 5px; align-items: center; }
.sat-row3 { display: flex; gap: 5px; }
.sat-row3 label { flex: 1; font-size: 9px; color: var(--text-faint); display: flex; flex-direction: column; gap: 2px; }
.sat-input, .sat-select {
  width: 100%; height: 26px; border-radius: 7px; border: 1px solid var(--border);
  background: rgba(10, 18, 34, 0.6); color: var(--text); font-size: 11px;
  font-family: inherit; padding: 0 8px; outline: none; box-sizing: border-box;
}
.sat-input:focus, .sat-select:focus { border-color: var(--border-hi); }
.sat-select option { background: #0b1526; }
.sat-color { width: 26px; height: 26px; border: 1px solid var(--border); border-radius: 7px; background: none; padding: 1px; cursor: var(--cur-hot); }
.sat-btn-go {
  height: 26px; padding: 0 12px; border-radius: 7px; border: 1px solid var(--border-hi);
  background: rgba(47, 111, 216, 0.3); color: #cfe4ff; font-size: 11px; font-family: inherit;
  cursor: var(--cur-hot); flex: none; transition: background 0.15s ease;
}
.sat-btn-go:hover { background: rgba(47, 111, 216, 0.5); }
.sat-btn-go.danger { border-color: rgba(255, 120, 100, 0.4); color: #ffb3a7; background: rgba(255, 90, 70, 0.12); }
.sat-file { font-size: 10px; color: var(--text-dim); width: 100%; }
.sat-note { font-size: 9px; line-height: 1.6; color: var(--text-faint); margin: 4px 0 2px; }
.sat-list { margin-top: 6px; }
.sat-item {
  display: flex; align-items: center; gap: 6px; padding: 4px 6px; border-radius: 6px;
  font-size: 11px; color: var(--text-dim); border-bottom: 1px solid rgba(120, 170, 255, 0.05);
}
.sat-item:hover { background: rgba(90, 167, 255, 0.08); color: var(--text); }
.sat-item .nm { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sat-item .no { font-family: Consolas, monospace; font-size: 9px; color: var(--text-faint); flex: none; }
.sat-item .del { cursor: var(--cur-hot); color: var(--text-faint); padding: 0 3px; }
.sat-item .del:hover { color: #ff9d8f; }
.sat-item[data-follow] { cursor: var(--cur-hot); }
.sat-item[data-follow]:hover .nm { color: #6fe0a8; }
/* TLE 跟随模式 HUD */
.tle-follow-hud {
  position: fixed; top: 66px; left: 50%; transform: translateX(-50%);
  z-index: 30; display: none; align-items: center; gap: 10px;
  padding: 9px 20px; border-radius: 22px;
  background: rgba(12, 22, 40, 0.82); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(111, 224, 168, 0.45);
  color: #cfe9db; font-size: 14px; letter-spacing: 0.04em;
  cursor: var(--cur-hot); box-shadow: 0 4px 18px rgba(0, 0, 0, 0.4);
  transition: border-color 0.2s ease;
  white-space: nowrap;
}
.tle-follow-hud:hover { border-color: rgba(111, 224, 168, 0.9); }
.tle-follow-hud b { color: #6fe0a8; font-weight: 600; font-size: 15px; }
.fhud-group {
  padding: 2px 9px; border-radius: 10px; font-size: 12px;
  color: #ffd9a0; border: 1px solid rgba(255, 217, 160, 0.4); background: rgba(255, 217, 160, 0.08);
}

/* ---- 预设星库 ---- */
.preset-lib { margin-bottom: 8px; }
.preset-chips { display: flex; flex-wrap: wrap; gap: 5px; }
.preset-chip {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 4px 9px; border-radius: 13px; cursor: var(--cur-hot);
  background: rgba(90, 167, 255, 0.07); border: 1px solid rgba(120, 170, 255, 0.16);
  color: var(--text-dim, #a8bdd8); font-size: 10.5px; transition: all 0.15s ease;
}
.preset-chip:hover { border-color: rgba(120, 200, 255, 0.55); color: #dceaff; background: rgba(90, 167, 255, 0.13); }
.preset-chip .pdot { width: 6px; height: 6px; border-radius: 50%; flex: none; box-shadow: 0 0 5px currentColor; }

/* ---- TLE 列表组徽标 ---- */
.gbadge {
  flex: none; max-width: 84px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 9px; padding: 1px 6px; border-radius: 8px;
  border: 1px solid; background: rgba(255, 255, 255, 0.03); opacity: 0.95;
}

/* 自定义复选框：替换原生蓝色勾选框——玻璃拟态 + 冷光描边，贴合整体设计语言 */
.sat-check {
  appearance: none; -webkit-appearance: none;
  width: 14px; height: 14px; margin: 0; flex: none; position: relative;
  border-radius: 4px;
  border: 1px solid rgba(122, 178, 255, 0.32);
  background: linear-gradient(180deg, rgba(16, 26, 46, 0.92), rgba(8, 13, 24, 0.92));
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.55);
  cursor: var(--cur-hot);
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.sat-check:hover { border-color: var(--border-hi); }
.sat-check:checked {
  border-color: rgba(126, 200, 255, 0.6);
  background: linear-gradient(180deg, rgba(90, 167, 255, 0.30), rgba(58, 118, 220, 0.22));
  box-shadow: inset 0 0 0 1px rgba(126, 200, 255, 0.22), 0 0 7px rgba(90, 167, 255, 0.35);
}
.sat-check:checked::after {
  content: ""; position: absolute; left: 4px; top: 0.5px;
  width: 4px; height: 8px;
  border: solid #cfe6ff; border-width: 0 1.5px 1.5px 0;
  transform: rotate(45deg);
}
.const-head { display: flex; align-items: center; gap: 7px; padding: 5px 4px; border-radius: 7px; cursor: var(--cur-hot); }
.const-head:hover { background: rgba(90, 167, 255, 0.08); }
.const-dot { width: 8px; height: 8px; border-radius: 50%; flex: none; box-shadow: 0 0 6px currentColor; }
.const-name { flex: 1; font-size: 12px; color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.const-cnt { font-size: 9px; color: var(--text-faint); font-family: Consolas, monospace; }
.const-arrow { font-size: 9px; color: var(--text-faint); display: inline-block; transition: transform 0.15s ease; }
.const-head.open .const-arrow { transform: rotate(-90deg); }
.const-body { display: none; padding: 2px 4px 6px 22px; }
.const-body.open { display: block; }
.const-add-row { display: flex; gap: 4px; margin-bottom: 4px; }
/* z224 对照表导入：次级"导入"按钮（顶部新星座 / 组内追加同款） */
.sat-btn-go.ghost { background: rgba(10, 18, 34, 0.55); border-color: var(--border); color: var(--text-dim); font-size: 10px; }
.sat-btn-go.ghost:hover { background: rgba(47, 111, 216, 0.3); color: #cfe4ff; border-color: var(--border-hi); }
.const-add-row.manual .sat-input { flex: 1 1 30%; min-width: 0; }
.sat-btn-imp { flex: none; padding: 0 8px; height: 24px; font-size: 10px; }
/* 星座组：重命名按钮 / 行内编辑 / 缺 TLE 警示 */
.const-ren { cursor: var(--cur-hot); color: var(--text-faint); font-size: 10px; padding: 0 2px; flex: none; }
.const-ren:hover { color: #6fe0a8; }
.sat-item.editing { flex-wrap: wrap; gap: 3px; background: rgba(90, 167, 255, 0.07); border-radius: 6px; }
.sat-item.editing .ed-nm { flex: 1 1 100%; height: 20px; font-size: 10px; }
.sat-item.editing .ed-id { flex: 1; height: 20px; font-size: 10px; font-family: Consolas, monospace; }
.sat-item.editing .ed-save:hover { color: #6fe0a8; }
.sat-item.notle .nm { opacity: 0.6; }
.pass-row {
  display: flex; gap: 8px; padding: 5px 6px; border-radius: 6px; cursor: var(--cur-hot);
  font-size: 10px; font-family: Consolas, monospace; color: var(--text-dim);
  border-bottom: 1px solid rgba(120, 170, 255, 0.05);
}
.pass-row:hover { background: rgba(90, 167, 255, 0.1); color: var(--text); }
.pass-row .el { color: #7fe0a0; }

/* ---------- 过境计算进度条（z183） ---------- */
.pass-prog {
  display: none; position: relative; height: 14px; margin: 6px 0 2px;
  background: rgba(120, 170, 255, 0.08); border-radius: 7px; overflow: hidden;
}
.pass-prog.on { display: block; }
.pass-prog-fill {
  height: 100%; width: 0%;
  background: linear-gradient(90deg, rgba(90, 167, 255, 0.55), rgba(127, 224, 160, 0.75));
  border-radius: 7px; transition: width 0.12s linear;
}
.pass-prog-txt {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-size: 9px; color: var(--text); letter-spacing: 0.5px;
}
#pass-calc-btn:disabled { opacity: 0.55; cursor: default; }

/* ---------- 首都点位标签（z137） ---------- */
.cap-label {
  pointer-events: none;
  width: 0; height: 0; overflow: visible;
  white-space: nowrap;
}
.cap-label .ci {
  position: absolute; bottom: 8px; left: 0;
  transform: translateX(-50%);
  font-size: 11px; letter-spacing: 0.06em;
  color: rgba(255, 226, 158, 0.95);
  text-shadow: 0 0 6px rgba(0, 0, 0, 0.95), 0 1px 3px rgba(0, 0, 0, 0.8);
}
.cap-label .ci .en {
  font-size: 9px; letter-spacing: 0.12em;
  color: rgba(255, 226, 158, 0.58);
  margin-left: 5px;
}

/* ---------- 着陆/坠毁探测器名牌（z156） ---------- */
.lander-label {
  pointer-events: none;
  width: 0; height: 0; overflow: visible;
  white-space: nowrap;
}
.lander-label .ci {
  position: absolute; bottom: 8px; left: 0;
  transform: translateX(-50%);
  font-size: 11px; letter-spacing: 0.06em;
  color: rgba(255, 226, 158, 0.95);
  text-shadow: 0 0 6px rgba(0, 0, 0, 0.95), 0 1px 3px rgba(0, 0, 0, 0.8);
  pointer-events: auto; cursor: var(--cur-hot, pointer);
  transition: color .15s;
}
.lander-label .ci:hover { color: #ffe9b0; text-decoration: underline; text-underline-offset: 2px; }
.lander-label .ci .en {
  font-size: 9px; letter-spacing: 0.12em;
  color: rgba(255, 226, 158, 0.58);
  margin-left: 5px;
}
/* 坠毁点位：红点红字 */
.lander-label.crash .ci { color: rgba(255, 122, 110, 0.95); }
.lander-label.crash .ci .en { color: rgba(255, 122, 110, 0.6); }
.lander-label.crash .ci:hover { color: #ff9a8c; }
.lander-label.impact .ci { color: rgba(140, 190, 255, 0.95); }
.lander-label.impact .ci .en { color: rgba(140, 190, 255, 0.6); }
.lander-label.impact .ci:hover { color: #a9cdff; }

/* ---------- TLE 卫星标签 ---------- */
.tle-label {
  font-size: 9px; letter-spacing: 0.06em; white-space: nowrap; color: #cfe9ff;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.9); pointer-events: auto; cursor: var(--cur-hot);
  padding-left: 9px; position: relative;
  transition: color 0.25s ease, font-size 0.25s ease, text-shadow 0.25s ease;
}
.tle-label::before {
  content: ''; position: absolute; left: 1px; top: 50%; transform: translateY(-50%);
  width: 3px; height: 3px; border-radius: 50%; background: currentColor; transition: all 0.25s ease;
}
.tle-label:hover { color: #fff; font-weight: 700; }
/* 卫星轨道线悬停：名字加粗转暖金（tle-hl 由 tle.js 悬停轨道线时挂上） */
.tle-label.tle-hl { color: #ffe3a6 !important; font-weight: 700; }
.tle-label.tle-hl::before { background: #ffe3a6; box-shadow: 0 0 6px rgba(255, 214, 140, 0.7); }
/* 选中卫星：名字放大 + 浅金高亮 */
.tle-label.tle-sel {
  font-size: 14px !important; color: #ffe3a6 !important;
  text-shadow: 0 0 8px rgba(255, 214, 140, 0.75), 0 1px 4px rgba(0, 0, 0, 0.9);
}
.tle-label.tle-sel::before { width: 5px; height: 5px; box-shadow: 0 0 6px rgba(255, 214, 140, 0.9); }

/* 任务卫星选中态（列表选中与场景点选同一观感：名字放大 + 浅金高亮） */
.mission-label.mission-sel {
  font-size: 14px !important; color: #ffe3a6 !important;
  text-shadow: 0 0 8px rgba(255, 214, 140, 0.75), 0 1px 4px rgba(0, 0, 0, 0.9);
}
.mission-label.mission-sel::before { background: #ffe3a6; box-shadow: 0 0 6px rgba(255, 214, 140, 0.9); }

/* ---------- 图谱视图：全屏 2D 科学图版 ---------- */
#atlas-canvas {
  position: fixed; inset: 0; z-index: 8;
  display: block; visibility: hidden; opacity: 0; pointer-events: none;
  background: #04060c;
  transition: opacity 0.45s ease, visibility 0s linear 0.45s;
}
#atlas-canvas.on {
  visibility: visible; opacity: 1; pointer-events: auto;
  transition: opacity 0.45s ease;
}

/* ---------- 模式切换动效：排布 morph 已由 lineMix 缓动补间接管（修复切换黑屏闪） ---------- */

/* ---------- 实时视图 HUD ---------- */
#live-hud {
  position: fixed; left: 16px; top: auto; bottom: 84px; z-index: 17;
  width: 300px; padding: 12px 14px 10px;
  background: rgba(10, 16, 28, 0.66);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border: 1px solid rgba(140, 175, 225, 0.22);
  border-radius: 10px;
  display: none; pointer-events: none;
}
#live-hud.on { display: block; pointer-events: auto; }
/* 实时视图左列对调：实时卡移到上方（原星体列表位 top:158），限高防遮挡，
 * 星体列表固定排在实时卡最大高度之下（无论卡内内容多少都不重叠；卡已支持拖动/缩放） */
#live-hud.on { max-height: 40vh; overflow-y: auto; scrollbar-width: thin; }
body.view-live #live-hud.on { top: 158px; bottom: auto; }
body.view-live #side-panel { top: calc(158px + 40vh + 12px); }
body.view-live #body-list { max-height: calc(100vh - 158px - 40vh - 32px); }
#live-hud .lh-head {
  display: flex; align-items: center; gap: 8px; margin-bottom: 6px;
}
#live-hud .lh-head b { font-size: 13px; letter-spacing: 0.22em; color: #ffe9c8; }
#live-hud .lh-clock { margin-left: auto; font: 11px Consolas, monospace; color: #dbe8fb; }
#live-hud .lh-clock + .lh-clock { margin-left: 0; }
#live-hud .lh-clock i { font-style: normal; font-size: 8px; color: rgba(160, 185, 220, 0.7); margin-left: 3px; }
#live-hud .lh-dot {
  width: 8px; height: 8px; border-radius: 50%;
  background: #8a93a5; flex: none;
}
#live-hud .lh-dot.live {
  background: #ff5a4e;
  animation: lhPulse 1.6s ease-out infinite;
}
@keyframes lhPulse {
  0% { box-shadow: 0 0 0 0 rgba(255, 90, 78, 0.55); }
  70% { box-shadow: 0 0 0 9px rgba(255, 90, 78, 0); }
  100% { box-shadow: 0 0 0 0 rgba(255, 90, 78, 0); }
}
#live-hud .lh-sub { font-size: 9px; margin-bottom: 8px; }
#live-hud .lh-sub .ok { color: #7fe0a0; }
#live-hud .lh-sub .warn { color: #ffcf7d; }
#live-hud .lh-row {
  display: flex; align-items: baseline; gap: 6px;
  font-size: 10px; padding: 2.5px 0;
  border-top: 1px solid rgba(140, 175, 225, 0.10);
}
#live-hud .lh-row.head {
  color: rgba(150, 178, 215, 0.85); font-size: 8.5px;
  letter-spacing: 0.12em; text-transform: uppercase;
  border-top: 1px solid rgba(140, 175, 225, 0.28);
}
#live-hud .lh-row .lh-name { width: 44px; color: #e6eefb; flex: none; }
#live-hud .lh-row .lh-val { margin-left: auto; font: 10px Consolas, monospace; color: #b9d2f2; }
#live-hud .lh-row .lh-val + .lh-val { margin-left: 10px; width: 64px; text-align: right; }
/* 表头行复用 .lh-name/.lh-val 对齐列位，但保持表头小字号 */
#live-hud .lh-row.head .lh-name,
#live-hud .lh-row.head .lh-val { font: inherit; color: inherit; }
#live-hud .lh-row.moon .lh-val { color: #ffe2b0; }
#live-hud .lh-note {
  margin-top: 8px; font-size: 8.5px; color: rgba(150, 175, 215, 0.6);
  letter-spacing: 0.04em;
}

/* ---------- 实时视图时间控制（z187：下放为页面底部整宽时间条，对齐图谱/三维时间轴带） ---------- */
#live-time {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 46;
  display: flex; align-items: center; gap: 12px;
  margin: 0; padding: 9px 18px;
  background: linear-gradient(180deg, rgba(12, 18, 32, 0.45), rgba(10, 15, 28, 0.88));
  backdrop-filter: blur(8px);
  border-top: 1px solid rgba(120, 170, 255, 0.22);
  pointer-events: auto;
}
#live-time .lt-row { display: flex; align-items: center; gap: 8px; margin-bottom: 0; flex: none; }
#live-time .lt-label {
  font-size: 8.5px; letter-spacing: 0.14em; color: rgba(170, 195, 230, 0.85);
  text-transform: uppercase; flex: none;
}
#live-time #live-datetime {
  width: 186px; flex: none;
  font: 10px Consolas, monospace; color: #dbe8fb;
  background: rgba(20, 30, 48, 0.85);
  border: 1px solid rgba(140, 175, 225, 0.30);
  border-radius: 4px; padding: 3px 4px;
  color-scheme: dark;
  outline: none;
}
#live-time #live-datetime:focus { border-color: rgba(255, 214, 150, 0.65); }
#live-time .lt-btn {
  flex: none; font-size: 9px; color: #ffe2b0;
  background: rgba(255, 200, 120, 0.10);
  border: 1px solid rgba(255, 210, 140, 0.35);
  border-radius: 4px; padding: 3px 7px; cursor: pointer;
}
#live-time .lt-btn:hover { background: rgba(255, 200, 120, 0.22); }
#live-time #live-slider {
  flex: 1; width: auto; min-width: 160px; height: 14px; margin: 0 6px; order: 3;
  -webkit-appearance: none; appearance: none;
  background: transparent; cursor: pointer;
}
#live-time #live-slider::-webkit-slider-runnable-track {
  height: 3px; border-radius: 2px;
  background: linear-gradient(90deg, rgba(120, 160, 220, 0.35), rgba(255, 210, 140, 0.55), rgba(120, 160, 220, 0.35));
}
#live-time #live-slider::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: 11px; height: 11px; margin-top: -4px; border-radius: 50%;
  background: #ffd896; border: 1px solid rgba(255, 235, 200, 0.9);
  box-shadow: 0 0 6px rgba(255, 200, 120, 0.55);
}
#live-time #live-slider::-moz-range-track {
  height: 3px; border-radius: 2px;
  background: linear-gradient(90deg, rgba(120, 160, 220, 0.35), rgba(255, 210, 140, 0.55), rgba(120, 160, 220, 0.35));
}
#live-time #live-slider::-moz-range-thumb {
  width: 11px; height: 11px; border-radius: 50%;
  background: #ffd896; border: 1px solid rgba(255, 235, 200, 0.9);
  box-shadow: 0 0 6px rgba(255, 200, 120, 0.55);
}
#live-time .lt-scale { display: contents; }
#live-time .lt-scale span {
  flex: none; font-size: 8px; color: rgba(150, 175, 215, 0.65); letter-spacing: 0.05em;
}
#live-time .lt-scale span:nth-child(1) { order: 2; }
#live-time .lt-scale span:nth-child(2) { order: 4; color: rgba(255, 214, 150, 0.8); }
#live-time .lt-scale span:nth-child(3) { order: 5; }

/* ---------- 星图（z212：d3-celestial 高精度内核容器） ----------
 * #sky-chart 为唯一绘制区容器，内核在其中自建/自管 canvas；
 * 原 #sky-gl（Three.js 全景贴图）与 #sky-canvas（手绘星点）已随深空层移除，
 * 其历史样式规则（336-340 行附近）保留未删，仅作废弃标记。 */
#sky-chart {
  position: absolute; inset: 0; overflow: hidden;
  cursor: grab; z-index: 1; background: #000;
  touch-action: none; /* 指针拖拽需要，禁用浏览器默认触摸手势 */
}
#sky-chart:active { cursor: grabbing; }
#sky-chart canvas {
  position: absolute; left: 0; top: 0; display: block;
  /* 内核按容器 clientWidth/Height 设置 style 尺寸，此处只定位不干预尺寸 */
}

/* ---------- 星图天体信息卡（z214：点击天体弹出，Star Walk 式暗色玻璃卡） ---------- */
#sky-info {
  position: absolute; left: 22px; bottom: 64px; z-index: 6;
  width: 264px; padding: 13px 15px 12px;
  border-radius: 12px;
  background: rgba(8, 14, 30, 0.82);
  border: 1px solid rgba(110, 150, 210, 0.25);
  backdrop-filter: blur(8px);
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.45);
}
#sky-info[hidden] { display: none; }
.sky-info-head { display: flex; align-items: baseline; gap: 8px; margin-bottom: 9px; }
.sky-info-head b { font-size: 15px; color: #f0f6ff; letter-spacing: 0.04em; }
#sky-info-type {
  font-size: 9px; letter-spacing: 0.14em; color: rgba(150, 200, 255, 0.78);
  padding: 2px 7px; border-radius: 20px; white-space: nowrap;
  background: rgba(80, 140, 230, 0.16); border: 1px solid rgba(110, 160, 240, 0.25);
}
.sky-info-row {
  display: flex; justify-content: space-between; gap: 12px;
  font-size: 11.5px; line-height: 1.9;
  color: rgba(180, 200, 235, 0.72);
}
.sky-info-row b { color: rgba(235, 244, 255, 0.95); font-weight: 600; font-family: Consolas, monospace; }
#sky-info-3d {
  width: 100%; margin-top: 10px; height: 30px;
  border-radius: 8px; border: 1px solid rgba(120, 170, 250, 0.4);
  background: rgba(70, 120, 220, 0.22); color: #cfe4ff;
  font-family: inherit; font-size: 11.5px; letter-spacing: 0.1em;
  cursor: pointer; transition: background 0.15s ease;
}
#sky-info-3d:hover { background: rgba(80, 135, 235, 0.38); }

/* ---------- 星图搜索框（z214 阶段2：顶中 Star Walk 式） ---------- */
#sky-search {
  position: absolute; left: 50%; top: 18px; transform: translateX(-50%); z-index: 7;
  width: min(380px, 46vw);
}
#sky-search-input {
  width: 100%; height: 36px; padding: 0 16px;
  border-radius: 20px; border: 1px solid rgba(120, 160, 230, 0.28);
  background: rgba(8, 14, 30, 0.78); color: #e8f1ff;
  font-size: 12.5px; outline: none; backdrop-filter: blur(8px);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35);
}
#sky-search-input::placeholder { color: rgba(160, 185, 225, 0.5); }
#sky-search-input:focus { border-color: rgba(130, 180, 255, 0.65); }
#sky-search-drop {
  margin-top: 6px; border-radius: 12px; overflow: hidden;
  background: rgba(8, 14, 30, 0.92); border: 1px solid rgba(120, 160, 230, 0.25);
  backdrop-filter: blur(10px); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
}
#sky-search-drop[hidden] { display: none; }
.sky-search-item {
  display: flex; align-items: baseline; gap: 8px;
  padding: 8px 14px; cursor: pointer;
}
.sky-search-item:hover { background: rgba(80, 130, 220, 0.18); }
.sky-search-item span {
  font-size: 9px; letter-spacing: 0.1em; color: rgba(140, 190, 255, 0.7);
  border: 1px solid rgba(110, 160, 240, 0.3); border-radius: 12px;
  padding: 1px 7px; white-space: nowrap;
}
.sky-search-item b { font-size: 12.5px; color: #eef5ff; font-weight: 600; }
.sky-search-item i { font-size: 10.5px; font-style: normal; color: rgba(170, 195, 235, 0.55); }
.sky-search-none { padding: 10px 14px; font-size: 11.5px; color: rgba(170, 195, 235, 0.55); }

/* ---------- 星图图层按钮与弹层（z214 阶段2） ---------- */
#sky-layers-btn {
  position: absolute; left: 22px; top: 18px; z-index: 7;
  height: 34px; padding: 0 16px; border-radius: 18px; cursor: pointer;
  border: 1px solid rgba(120, 160, 230, 0.28);
  background: rgba(8, 14, 30, 0.78); color: #dbe7fb;
  font-size: 12px; letter-spacing: 0.12em; backdrop-filter: blur(8px);
}
#sky-layers-btn:hover { border-color: rgba(130, 180, 255, 0.6); }
/* 阶段3：地平/赤道坐标模式切换按钮（图层按钮右侧） */
#sky-mode-btn {
  position: absolute; left: 96px; top: 18px; z-index: 7;
  height: 34px; padding: 0 16px; border-radius: 18px; cursor: pointer;
  border: 1px solid rgba(120, 160, 230, 0.28);
  background: rgba(8, 14, 30, 0.78); color: #dbe7fb;
  font-size: 12px; letter-spacing: 0.12em; backdrop-filter: blur(8px);
}
#sky-mode-btn:hover { border-color: rgba(130, 180, 255, 0.6); }
#sky-layers {
  position: absolute; left: 22px; top: 60px; z-index: 7;
  width: 190px; padding: 10px 14px 12px; border-radius: 12px;
  background: rgba(8, 14, 30, 0.92); border: 1px solid rgba(120, 160, 230, 0.25);
  backdrop-filter: blur(10px); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
}
#sky-layers[hidden] { display: none; }
.sky-layers-title {
  font-size: 10px; letter-spacing: 0.16em; color: rgba(150, 200, 255, 0.75);
  margin-bottom: 7px;
}
.sky-layer-row {
  display: flex; align-items: center; gap: 8px;
  font-size: 12px; color: rgba(220, 235, 255, 0.88);
  line-height: 2.1; cursor: pointer; user-select: none;
}
.sky-layer-row input { accent-color: #5b8fe0; }

/* ---------- 星图时间条（z214 阶段2：底部中央） ---------- */
#sky-timectl {
  position: absolute; left: 50%; bottom: 14px; transform: translateX(-50%); z-index: 7;
  display: flex; align-items: center; gap: 6px;
  padding: 6px 10px; border-radius: 20px;
  background: rgba(8, 14, 30, 0.78); border: 1px solid rgba(120, 160, 230, 0.25);
  backdrop-filter: blur(8px);
}
#sky-timectl button {
  height: 26px; min-width: 26px; padding: 0 8px; border-radius: 14px; cursor: pointer;
  border: 1px solid rgba(120, 160, 230, 0.3);
  background: rgba(60, 105, 190, 0.18); color: #d5e5ff;
  font-size: 11px; letter-spacing: 0.06em; font-family: inherit;
}
#sky-timectl button:hover { background: rgba(80, 135, 235, 0.35); }
#sky-timectl select {
  height: 26px; border-radius: 14px; border: 1px solid rgba(120, 160, 230, 0.3);
  background: rgba(10, 18, 34, 0.7); color: #d5e5ff; font-size: 11px;
  font-family: inherit; padding: 0 6px; outline: none; cursor: var(--cur-hot);
}
#sky-timectl select option { background: #0b1526; color: #d5e5ff; }
#sky-t-off {
  min-width: 88px; text-align: center;
  font-size: 11px; color: rgba(200, 220, 250, 0.85);
  font-family: Consolas, monospace;
}
/* z237：时刻输入行（时间条下方） */
#sky-timeedit {
  position: absolute; left: 50%; bottom: 56px; transform: translateX(-50%); z-index: 7;
  display: flex; gap: 6px; padding: 6px 10px; border-radius: 14px;
  background: rgba(8, 14, 30, 0.78); border: 1px solid rgba(120, 160, 230, 0.25);
  backdrop-filter: blur(8px);
}
#sky-t-input {
  width: 200px; height: 26px; border-radius: 12px; border: 1px solid rgba(120, 160, 230, 0.3);
  background: rgba(10, 18, 34, 0.7); color: #d5e5ff; font-size: 11px;
  font-family: Consolas, monospace; padding: 0 10px; outline: none;
}
#sky-t-input:focus { border-color: rgba(130, 180, 255, 0.6); }
#sky-timeedit button {
  height: 26px; padding: 0 13px; border-radius: 14px; cursor: pointer;
  border: 1px solid rgba(120, 160, 230, 0.3);
  background: rgba(60, 105, 190, 0.18); color: #d5e5ff; font-size: 11px; font-family: inherit;
}
#sky-timeedit button:hover { background: rgba(80, 135, 235, 0.35); }
/* z237：夜视红光模式——全星图界面转红光暗视（保护夜间视力） */
#sky-overlay.sky-night {
  filter: grayscale(1) brightness(0.75) sepia(1) hue-rotate(-42deg) saturate(4.5);
}
/* z237：星图状态提示条（顶部浮层） */
.sky-status-tip {
  position: fixed; left: 50%; top: 60px; transform: translateX(-50%); z-index: 40;
  padding: 6px 16px; border-radius: 16px; font-size: 12px;
  background: rgba(12, 22, 40, 0.85); color: #bfe0c8;
  border: 1px solid rgba(111, 224, 168, 0.4); backdrop-filter: blur(8px);
  pointer-events: none; white-space: nowrap;
}
.sky-status-tip.err { color: #ffb3a7; border-color: rgba(255, 120, 100, 0.4); }