#fx-layer{position:fixed;inset:0;pointer-events:none;z-index:30;overflow:hidden;contain:strict;--wm-gold:#f2c141;--world-orange:#cf7a32}
#fx-layer *{pointer-events:none!important}
.fx-leaf{position:absolute;width:16px;height:9px;border-radius:85% 0 85% 0;background:linear-gradient(25deg,#9c542a,#edb648);box-shadow:inset 0 -1px #824a27;opacity:.7}
.fx-ambient{top:18%;animation:autumn-drift 14s ease-in-out infinite}
.fx-ambient:nth-child(2){top:58%;animation-delay:-6s;animation-duration:19s}
@keyframes autumn-drift{0%,100%{transform:translateY(0) rotate(-25deg);opacity:.25}50%{transform:translateY(80px) rotate(120deg);opacity:.65}}
.fx-bloom{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 65%,#ffc45c55,transparent 70%);opacity:0;animation:lantern-bloom 2400ms ease-in-out}
@keyframes lantern-bloom{0%,100%{opacity:0}35%{opacity:1}}
.fx-halo{position:absolute;width:170px;height:170px;border-radius:50%;background:radial-gradient(circle,#ffca6550,transparent 68%);animation:lantern-bloom 1800ms ease-in-out}
.fx-window{position:absolute;left:-85px;top:24%;width:170px;height:220px;background:radial-gradient(ellipse,#efad4738,transparent 70%);animation:window-breath 8s ease-in-out infinite}
@keyframes window-breath{0%,100%{opacity:.25}50%{opacity:.8}}
.fx-hero{position:absolute;width:90px;height:120px;object-fit:contain;transform-origin:50% 95%;filter:drop-shadow(0 3px 3px #50311c30)}
.fx-cta{animation:quiet-invitation 2600ms ease-in-out infinite!important}
@keyframes quiet-invitation{0%,100%{transform:scale(1)}50%{transform:scale(1.045)}}
body[data-state="success"] #successPanel .card{animation:card-arrival 420ms ease-out}
@keyframes card-arrival{from{opacity:0;transform:translateY(10px) scale(.96)}to{opacity:1;transform:none}}
body[data-state="level-complete"] .bigface,body[data-state="game-complete"] .bigface{animation:quiet-invitation 4s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){.fx-ambient,.fx-leaf,.fx-bloom,.fx-halo,.fx-window{display:none}.fx-cta{animation:none!important}}