:root{--flicker-period:.769s;--flicker-dip:.46}
html,body{margin:0;height:100%;overflow:hidden;background:#89d3db}
.loading-backdrop{position:absolute;inset:0;overflow:hidden;background:#89d3db;isolation:isolate}
.loading-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;user-select:none}
.loading-background--day{filter:brightness(1.13) saturate(1.08)}
.loading-background--night{filter:brightness(1.24) saturate(1.04);opacity:var(--night,0);will-change:opacity}
.loading-lights{position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen;opacity:var(--lights,0);will-change:opacity}
/* 灯火出现前保持暂停：16 层全屏 screen 混合不必空转 */
.loading-lights__layer{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center;animation:lantern-flicker-1 13s ease-in-out infinite;animation-play-state:paused}
.loading-lights.is-live .loading-lights__layer{animation-play-state:running}
.loading-lights__layer--1{animation-duration:calc(var(--flicker-period)*17);animation-delay:0s}
.loading-lights__layer--2{animation-duration:calc(var(--flicker-period)*23);animation-delay:calc(var(--flicker-period)*-1.44)}
.loading-lights__layer--3{animation-duration:calc(var(--flicker-period)*19);animation-delay:calc(var(--flicker-period)*-2.38)}
.loading-lights__layer--4{animation-duration:calc(var(--flicker-period)*29);animation-delay:calc(var(--flicker-period)*-5.44)}
.loading-lights__layer--5{animation-duration:calc(var(--flicker-period)*21);animation-delay:calc(var(--flicker-period)*-5.25)}
.loading-lights__layer--6{animation-duration:calc(var(--flicker-period)*27);animation-delay:calc(var(--flicker-period)*-8.44)}
.loading-lights__layer--7{animation-duration:calc(var(--flicker-period)*16);animation-delay:calc(var(--flicker-period)*-6)}
.loading-lights__layer--8{animation-duration:calc(var(--flicker-period)*25);animation-delay:calc(var(--flicker-period)*-10.94)}
.loading-lights__layer--9{animation-duration:calc(var(--flicker-period)*22);animation-delay:calc(var(--flicker-period)*-11)}
.loading-lights__layer--10{animation-duration:calc(var(--flicker-period)*30);animation-delay:calc(var(--flicker-period)*-16.88)}
.loading-lights__layer--11{animation-duration:calc(var(--flicker-period)*18);animation-delay:calc(var(--flicker-period)*-11.25)}
.loading-lights__layer--12{animation-duration:calc(var(--flicker-period)*26);animation-delay:calc(var(--flicker-period)*-17.88)}
.loading-lights__layer--13{animation-duration:calc(var(--flicker-period)*20);animation-delay:calc(var(--flicker-period)*-15)}
.loading-lights__layer--14{animation-duration:calc(var(--flicker-period)*24);animation-delay:calc(var(--flicker-period)*-19.5)}
.loading-lights__layer--15{animation-duration:calc(var(--flicker-period)*28);animation-delay:calc(var(--flicker-period)*-24.5)}
.loading-lights__layer--16{animation-duration:calc(var(--flicker-period)*15);animation-delay:calc(var(--flicker-period)*-14.06)}
@keyframes lantern-flicker-1{0%,86%{opacity:1}93%{opacity:calc(1 - var(--flicker-dip))}100%{opacity:1}}
.fish-loader{position:absolute;z-index:2;right:max(-.5vw,calc(env(safe-area-inset-right) - 6px));bottom:4.2vh;width:clamp(144px,13.333vw,256px);aspect-ratio:1;pointer-events:none}
.fish-loader__art{display:block;width:100%;height:100%;overflow:visible}
.fish-loader__mist{mix-blend-mode:screen;opacity:.2;animation:lantern-breath 5s ease-in-out infinite alternate}
.fish-loader__orbit{transform-origin:515px 515px;animation:lantern-orbit 12s linear infinite}
.fish-loader__glow{filter:blur(64px);opacity:calc(var(--night)*.75)}
.fish-loader__glow-breath{animation:lantern-glow 3.6s ease-in-out infinite alternate}
.fish-loader__fish{filter:drop-shadow(0 0 7px #ffce75);transform-box:fill-box;--sway-from:-10deg;--sway-to:10deg;animation:fish-sway 1.4s ease-in-out infinite alternate}
.fish-loader__fish--0{animation-delay:-.2s}
.fish-loader__fish--1{animation-delay:-1.1s}
.fish-loader__fish--2{animation-delay:-2s}
.fish-loader__track{fill:none;stroke:#ffd58b;stroke-opacity:.16;stroke-width:2}
.fish-loader__progress{fill:none;stroke:#ffe5a5;stroke-width:3;stroke-linecap:round;filter:drop-shadow(0 0 6px #ffc65f)}
.fish-loader__label{position:absolute;top:86%;left:50%;transform:translateX(-50%);color:#ffe2a7;font:400 clamp(10px,.69vw,13px)/1.3 Arial,sans-serif;letter-spacing:.055em;white-space:nowrap;text-shadow:0 0 7px #eaa94280}
.fish-loader__reflection{filter:blur(11px);opacity:calc(.08 + var(--night)*.64)}
.fish-loader__retry{display:none;position:absolute;top:96%;left:50%;transform:translateX(-50%);white-space:nowrap;border:0;background:transparent;color:#ffe4ad;text-decoration:underline;font-size:11px;cursor:pointer;pointer-events:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
@keyframes lantern-orbit{to{transform:rotate(360deg)}}
@keyframes fish-sway{from{transform:rotate(var(--sway-from))}to{transform:rotate(var(--sway-to))}}
@keyframes lantern-glow{from{opacity:.55}to{opacity:1}}
@keyframes lantern-breath{from{opacity:.15}to{opacity:.23}}
@media (prefers-reduced-motion:reduce){.fish-loader__orbit,.fish-loader__mist,.fish-loader__fish,.fish-loader__glow-breath,.loading-lights__layer{animation:none!important}}
.fish-loader__orbit,.fish-loader__glow-breath{backface-visibility:hidden}

/* ── 日夜交替改为纯 CSS 动画：不在 JS 里每帧改样式，交给合成器（GPU）跑，透明度变化才丝滑 ── */
.loading-backdrop .loading-background--night{opacity:0}
.loading-backdrop .loading-lights{opacity:0}
.fish-loader__glow{filter:blur(64px);opacity:0}
.fish-loader__reflection{filter:blur(11px);opacity:.08}
body.bg-run .loading-background--night{animation:dsh-night var(--bg-seconds,5.5s) cubic-bezier(.33,0,.67,1) forwards;will-change:opacity}
body.bg-run .loading-lights{animation:dsh-lights var(--lights-seconds,2.2s) cubic-bezier(.4,0,.6,1) var(--lights-delay,3.3s) forwards;will-change:opacity}
body.bg-run .fish-loader__glow{animation:dsh-glow var(--bg-seconds,5.5s) cubic-bezier(.33,0,.67,1) forwards}
body.bg-run .fish-loader__reflection{animation:dsh-reflect var(--bg-seconds,5.5s) cubic-bezier(.33,0,.67,1) forwards}
@keyframes dsh-night{from{opacity:0}to{opacity:1}}
@keyframes dsh-lights{from{opacity:0}to{opacity:1}}
@keyframes dsh-glow{from{opacity:0}to{opacity:.75}}
@keyframes dsh-reflect{from{opacity:.08}to{opacity:.72}}
@media (prefers-reduced-motion:reduce){
  body.bg-run .loading-background--night,body.bg-run .loading-lights,body.bg-run .fish-loader__glow,body.bg-run .fish-loader__reflection{animation:none}
  body.bg-run .loading-background--night{opacity:1}
  body.bg-run .loading-lights{opacity:1}
  body.bg-run .fish-loader__glow{opacity:.75}
  body.bg-run .fish-loader__reflection{opacity:.72}
}
