/* ============================================================
   庭院 · 场景层
   月亮 / 树影 / 石径 / 暖灯 / 植物
   全部是轻量 CSS + SVG，不做 3D，不拖慢使用。
   ============================================================ */

.sky {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(120% 78% at 76% -12%, #1b2440 0%, rgba(20,26,44,0) 62%),
    radial-gradient(90% 60% at 12% 6%, #16203a 0%, rgba(14,18,32,0) 60%),
    linear-gradient(180deg, var(--night-800) 0%, var(--night-900) 46%, var(--night-1000) 100%);
}

/* 月光薄雾：极缓慢地移动，几乎察觉不到 */
.sky__haze {
  position: absolute;
  inset: -10%;
  background:
    radial-gradient(46% 34% at 74% 16%, rgba(226, 189, 124, 0.055) 0%, rgba(226,189,124,0) 70%),
    radial-gradient(60% 40% at 20% 74%, rgba(157, 146, 216, 0.045) 0%, rgba(157,146,216,0) 72%);
  animation: hazeDrift 64s var(--ease) infinite alternate;
}
@keyframes hazeDrift {
  from { transform: translate3d(0, 0, 0) scale(1); }
  to   { transform: translate3d(-1.6%, 1.2%, 0) scale(1.03); }
}

/* ── 星点 ────────────────────────────────────────────────── */
.sky__stars { position: absolute; inset: 0; }
.sky__stars i {
  position: absolute;
  width: 2px; height: 2px;
  border-radius: 50%;
  background: var(--moon-100);
  opacity: 0.35;
  animation: twinkle 6.4s ease-in-out infinite;
}
@keyframes twinkle {
  0%, 100% { opacity: 0.16; transform: scale(0.9); }
  50%      { opacity: 0.62; transform: scale(1); }
}

/* ── 月亮 ────────────────────────────────────────────────── */
.sky__moon {
  position: absolute;
  top: 5%;
  left: 56%;
  width: 78px;
  height: 78px;
  animation: moonDrift 26s var(--ease) infinite alternate;
}
@keyframes moonDrift {
  from { transform: translateY(0) }
  to   { transform: translateY(-7px) }
}
.sky__moon::after {
  /* 月晕：一圈很淡的光 */
  content: "";
  position: absolute;
  inset: -150%;
  background: radial-gradient(circle, rgba(226,189,124,0.13) 0%, rgba(226,189,124,0.05) 26%, rgba(226,189,124,0) 62%);
  pointer-events: none;
}

@media (min-width: 641px) {
  .sky__moon { left: auto; right: 9%; top: 7%; width: 108px; height: 108px; }
}
@media (min-width: 1024px) {
  .sky__moon { right: 13%; top: 10%; width: 144px; height: 144px; }
}

/* ── 檐前枝叶（从画面上方垂下来，框住庭院） ─────────────── */
.bough {
  position: absolute;
  top: 0;
  width: min(660px, 66vw);
  height: auto;
  opacity: 0.94;
}
.bough--l { left: 0; }
.bough--r { right: 0; transform: scaleX(-1); }

.bough__g {
  transform-box: fill-box;
  transform-origin: 0% 0%;
  animation: sway var(--e-sway) ease-in-out infinite alternate;
}
.bough__g--r { animation-delay: -3.8s; animation-duration: 12.5s; }
@keyframes sway {
  from { transform: rotate(-0.45deg); }
  to   { transform: rotate(0.65deg); }
}

/* ── 地面 / 石径 / 暖灯 ──────────────────────────────────── */
.garden {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  width: 100%;
  height: 52vh;
  min-height: 300px;
}
.garden__sway {
  transform-box: fill-box;
  transform-origin: 50% 100%;
  animation: sway var(--e-sway) ease-in-out infinite alternate;
  animation-delay: -5.5s;
}
.garden__sway--b { animation-delay: -8.2s; animation-duration: 13s; }

/* 暖灯：微微呼吸 */
.lantern__glow {
  animation: breathe var(--e-breathe) ease-in-out infinite;
  transform-box: fill-box;
  transform-origin: 50% 50%;
}
.lantern__core { animation: breatheCore var(--e-breathe) ease-in-out infinite; }
@keyframes breathe {
  0%, 100% { opacity: 0.62; transform: scale(0.96); }
  50%      { opacity: 1;    transform: scale(1.04); }
}
@keyframes breatheCore {
  0%, 100% { opacity: 0.82; }
  50%      { opacity: 1; }
}

/* 萤火：三四点，慢，柔 */
.fly {
  animation: fly 17s ease-in-out infinite;
}
.fly--2 { animation-delay: -6s; animation-duration: 21s; }
.fly--3 { animation-delay: -11s; animation-duration: 15s; }
@keyframes fly {
  0%   { transform: translate(0, 0); opacity: 0; }
  18%  { opacity: 0.75; }
  50%  { transform: translate(34px, -26px); opacity: 0.45; }
  82%  { opacity: 0.7; }
  100% { transform: translate(-14px, -52px); opacity: 0; }
}

/* ── 场地被压低时的处理（小屏）：场景只留天气感 ── */
@media (max-width: 640px) {
  .garden { height: 40vh; min-height: 240px; opacity: 0.9; }
}