/* 空から南城（独立節）専用CSS。番人裁定 2026-07-13・16_view3d.cssの器を流用。
 * 掟：既存CSS（vn.css）の変数・クラスに依存しない自己完結（節の外枠 mag wrap のみ既存グリッドに乗る）。
 * 規約：Googleのロゴ・帰属（下辺）に一切干渉しない——字幕は上辺・覆いを持たない。 */

.vnsky {
  opacity: 0;
  transition: opacity .9s ease;
}
.vnsky.is-on { opacity: 1; }

.vnsky__lead {
  margin: 0 0 16px;
  max-width: 44em;
  font-size: 14px;
  line-height: 2;
  opacity: .85;
}

.vnsky__stage { position: relative; }

/* 地図の器（下辺の帰属はGoogleが要素内に描く＝覆わない） */
.vnsky__map {
  display: none;
  width: 100%;
  height: clamp(320px, 52vh, 560px);
  background: transparent;
}
.vnsky.is-live .vnsky__map { display: block; }
.vnsky__map gmp-map-3d {
  display: block;
  width: 100%;
  height: 100%;
}

/* 字幕：上辺中央・pointer-events無効・下辺の帰属と構造的に重ならない */
.vnsky__cap {
  position: absolute;
  top: 14px;
  left: 50%;
  transform: translateX(-50%);
  margin: 0;
  padding: 6px 18px;
  font-size: 14px;
  letter-spacing: .18em;
  color: #fff;
  background: rgba(20, 26, 24, .55);
  border-radius: 2px;
  pointer-events: none;
  opacity: 0;
  transition: opacity .6s ease;
  z-index: 1;
  white-space: nowrap;
}
.vnsky__cap.is-on { opacity: 1; }

/* モバイルのタップ起動カード（16_と同型・画像なし） */
.vnsky__start {
  display: none;
  padding: 12px 28px;
  font: inherit;
  font-size: 14px;
  letter-spacing: .12em;
  color: inherit;
  background: transparent;
  border: 1px solid currentColor;
  border-radius: 2px;
  cursor: pointer;
}
.vnsky--tap .vnsky__start { display: inline-block; }
.vnsky--tap .vnsky__map { display: none; }

/* 読み込み位相（warm）：display:none＝サイズ0では gmp-steadychange が発火しないため、
 * 実寸を持つ不可視の固定枠で先に読み込ませる（16_の学び）。ページに影を落とさない。 */
.vnsky--pre { padding: 0; margin: 0; }
.vnsky--pre .mag__title, .vnsky--pre .vnsky__lead, .vnsky--pre .vnsky__start { display: none; }
.vnsky--warm .vnsky__map {
  display: block;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  opacity: 0;
  pointer-events: none;
  z-index: -1;
}