/* 渡口 · Ferry —— 江夜场景：手绘 SVG 的着色与动效（scene.css）
 * 零外链：不引图片、不走 CDN，全部内联 SVG + CSS。
 * 动效只做四类：星光闪烁、雾漂移、水波横移、船身轻摇 —— 各一条，够用即止。
 * 暗景可读性靠三件事：① 轮廓光（描边）② 两盏暖灯 ③ 灯下的暖光晕 —— 不做整体提亮。
 * 尊重系统「减少动态效果」：在 theme.css 末尾统一关闭。
 */

.scene { background: #04101b; }

/* 星：亮度分三档交错，避免整齐一闪 */
.scene .stars circle { fill: #fdf6e8; fill-opacity: 0.68; animation: twinkle 5.5s ease-in-out infinite; }
.scene .stars circle:nth-child(2n) { animation-duration: 7.4s; animation-delay: -1.6s; }
.scene .stars circle:nth-child(3n) { animation-duration: 9.2s; animation-delay: -3.4s; }
@keyframes twinkle { 0%, 100% { fill-opacity: 0.34; } 50% { fill-opacity: 1; } }

/* 月：月面自带明暗（渐变 + 环形山），只呼吸一点点 */
.scene .moon-glow { animation: moonBreathe 15s ease-in-out infinite; }
@keyframes moonBreathe { 0%, 100% { opacity: 0.78; } 50% { opacity: 1; } }
.scene .craters { animation: moonBreathe 15s ease-in-out infinite; }

/* 远山与雾：色阶拉开，山才有层 */
.scene .hill-far { fill: #1d4759; }
.scene .hill-near { fill: #102c3c; }
.scene .mist { fill: #24596f; opacity: 0.3; animation: drift 26s ease-in-out infinite; }
@keyframes drift { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(-26px); } }

/* 江面与波纹 */
.scene .river { fill: url(#riverGrad); }
.scene .moon-path { animation: shimmer 6.5s ease-in-out infinite; }
@keyframes shimmer { 0%, 100% { opacity: 0.11; } 50% { opacity: 0.24; } }
.scene .waves path { fill: none; stroke: #b6e4f4; stroke-opacity: 0.3; stroke-width: 1.5; }
.scene .waves path:last-child { stroke-opacity: 0.2; animation: waveShift 14s linear infinite; }
@keyframes waveShift { from { transform: translateX(0); } to { transform: translateX(-150px); } }

/* 码头：木构加一圈冷色轮廓光，结构才看得清 */
.scene .pier rect {
  fill: #6d8c93;
  stroke: #c2e2e8; stroke-opacity: 0.6; stroke-width: 1.1;
}
.scene .pier .pier-post { fill: #4d6a72; }
.scene .pier-lamp-rod { stroke: #7d5832; stroke-width: 2; }
.scene .pier-lamp { fill: #ffe4bd; animation: lampFlicker 5.4s ease-in-out infinite; }
.scene .pier-lamp-glow { animation: lampBreathe 5.4s ease-in-out infinite; }

/* 渡船：暖色轮廓光勾边 —— 暗底上「看得见」靠的是这道光 */
.scene .boat { transform-box: fill-box; transform-origin: 50% 100%; animation: bob 7.5s ease-in-out infinite; }
@keyframes bob { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-3px) rotate(-0.6deg); } }
.scene .boat-hull {
  fill: #8d6438;
  stroke: #f0c184; stroke-opacity: 0.8; stroke-width: 1.6;
}
.scene .boat-deck { fill: #a4733f; stroke: #f0c184; stroke-opacity: 0.55; stroke-width: 1.1; }
.scene .boat-canopy { fill: #bd8b52; stroke: #f5cd97; stroke-opacity: 0.6; stroke-width: 1.2; }
.scene .boat-mast { stroke: #d6ab6c; stroke-width: 2; }
.scene .boat-window { fill: #ffdca8; }
.scene .boat-lamp { fill: #ffe4bd; animation: lampFlicker 4.6s ease-in-out infinite; }
.scene .boat-lamp-glow { animation: lampBreathe 4.6s ease-in-out infinite; }
@keyframes lampFlicker { 0%, 100% { opacity: 0.9; } 50% { opacity: 1; } }
@keyframes lampBreathe { 0%, 100% { opacity: 0.55; transform: scale(1); } 50% { opacity: 0.92; transform: scale(1.08); } }

/* 倒影：跟着船一起轻摇 */
.scene .reflect { transform-box: fill-box; transform-origin: 50% 0%; opacity: 0.9; animation: bob 7.5s ease-in-out infinite; }