/* Full-screen seasonal scenery: click-through, CSS-only motion, no wallet hooks. */
#dw-halloween { position: fixed; inset: 0; z-index: 30; pointer-events: none; overflow: hidden; contain: layout style; }
#dw-halloween .dw-halloween-art { position: absolute; inset: 0; pointer-events: none; transition: opacity .3s; }
#dw-halloween svg { display: block; width: 100%; height: 100%; }
#dw-halloween .dw-halloween-pumpkin { position: absolute; width: 46px; height: 46px; opacity: .62; filter: drop-shadow(0 0 7px #e8772445); animation: dw-halloween-bob 7s ease-in-out infinite; }
#dw-halloween .pumpkin-0 { left: 12px; bottom: 22px; }
#dw-halloween .pumpkin-1 { right: 14px; bottom: 28px; width: 57px; height: 57px; animation-delay: -3s; }
#dw-halloween .pumpkin-2 { left: 19%; bottom: 7px; width: 29px; height: 29px; opacity: .35; animation-delay: -5s; }
#dw-halloween .pumpkin-3 { right: 19%; top: 90px; width: 28px; height: 28px; opacity: .35; animation-delay: -2s; }
#dw-halloween .dw-halloween-bat { position: absolute; width: 52px; height: 30px; fill: #b48bea; opacity: .4; animation: dw-halloween-fly 27s linear infinite; }
#dw-halloween .bat-0 { top: 12%; left: -70px; animation-delay: -5s; }
#dw-halloween .bat-1 { top: 27%; left: -70px; width: 35px; animation-duration: 34s; animation-delay: -16s; opacity: .26; }
#dw-halloween .bat-2 { top: 57%; left: -70px; animation-duration: 39s; animation-delay: -29s; opacity: .2; }
#dw-halloween .bat-3 { top: 77%; left: -70px; width: 39px; animation-direction: reverse; animation-duration: 32s; animation-delay: -10s; opacity: .26; }
#dw-halloween .bat-4 { top: 7%; left: -70px; width: 34px; animation-direction: reverse; animation-duration: 31s; animation-delay: -23s; }
#dw-halloween .bat-5 { top: 39%; left: -70px; width: 30px; animation-direction: reverse; animation-duration: 41s; animation-delay: -8s; opacity: .19; }
#dw-halloween .dw-halloween-wing-left { transform-origin: 40px 22px; animation: dw-halloween-flap 1.2s ease-in-out infinite alternate; }
#dw-halloween .dw-halloween-wing-right { transform-origin: 40px 22px; animation: dw-halloween-flap 1.2s ease-in-out infinite alternate-reverse; }
#dw-halloween .dw-halloween-ghost { position: absolute; width: 49px; height: 63px; opacity: .23; animation: dw-halloween-haunt 17s ease-in-out infinite; }
#dw-halloween .ghost-0 { left: 2%; top: 37%; }
#dw-halloween .ghost-1 { right: 2%; top: 64%; width: 37px; height: 49px; animation-delay: -8s; }
#dw-halloween .ghost-2 { left: 29%; top: 18%; width: 26px; height: 34px; opacity: .13; animation-delay: -12s; }
#dw-halloween .dw-halloween-web { position: absolute; width: 112px; height: 112px; top: 77px; opacity: .21; }
#dw-halloween .dw-halloween-web.is-left { left: 0; }
#dw-halloween .dw-halloween-web.is-right { right: 0; transform: scaleX(-1); }
#dw-halloween .dw-halloween-moon { position: absolute; top: 105px; left: 23%; width: 49px; height: 49px; border-radius: 50%; box-shadow: inset 11px -5px #dfbd7540; transform: rotate(-20deg); }
#dw-halloween .dw-halloween-mist { position: absolute; inset: auto -15% -35px; height: 115px; background: radial-gradient(ellipse at 25% 100%, #9760d020, transparent 60%), radial-gradient(ellipse at 80% 100%, #e8862415, transparent 60%); animation: dw-halloween-mist 24s ease-in-out infinite alternate; }
#dw-halloween .dw-halloween-ember { position: absolute; left: var(--x); bottom: -10px; width: 3px; height: 3px; border-radius: 50%; background: #f1a453; opacity: 0; animation: dw-halloween-rise var(--duration) linear var(--delay) infinite; }
#dw-halloween .dw-halloween-toggle { position: absolute; top: 23px; left: 50%; transform: translateX(-50%); min-width: 110px; height: 27px; padding: 3px 9px; border: 1px solid #9a653c; border-radius: 14px; background: #191222; color: #f4ce9b; font: 11px/18px system-ui, sans-serif; white-space: nowrap; cursor: pointer; pointer-events: auto; }
#dw-halloween .dw-halloween-toggle:hover { border-color: #f0a34b; color: #ffe2b5; }
#dw-halloween .dw-halloween-toggle:focus-visible { outline: 2px solid #f0a34b; outline-offset: 3px; }
#dw-halloween.is-off .dw-halloween-art { display: none; }
#dw-halloween.is-paused * { animation-play-state: paused !important; }
/* Fade scenery away while entering data; dialogs remain completely clear. */
body:has(input:focus, textarea:focus, select:focus) #dw-halloween .dw-halloween-art { opacity: .12; }
body:has(.dw-modal-backdrop) #dw-halloween .dw-halloween-art { visibility: hidden; }
@keyframes dw-halloween-bob { 0%, 100% { transform: translateY(0) rotate(-4deg); } 50% { transform: translateY(-9px) rotate(4deg); } }
@keyframes dw-halloween-flap { from { transform: scaleY(.55); } to { transform: scaleY(1); } }
@keyframes dw-halloween-fly { 0% { transform: translate(-10vw, 0) rotate(-8deg); } 25% { transform: translate(30vw, -22px) rotate(5deg); } 65% { transform: translate(80vw, 18px) rotate(-5deg); } 100% { transform: translate(125vw, -12px) rotate(8deg); } }
@keyframes dw-halloween-haunt { 0%, 100% { transform: translate(0, 0) rotate(-6deg); } 50% { transform: translate(16px, -38px) rotate(6deg); } }
@keyframes dw-halloween-mist { from { transform: translateX(-3%); } to { transform: translateX(3%); } }
@keyframes dw-halloween-rise { 0% { transform: translate(0, 0); opacity: 0; } 15% { opacity: .28; } 80% { opacity: .18; } 100% { transform: translate(28px, -90vh); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { #dw-halloween * { animation: none !important; } #dw-halloween .dw-halloween-bat, #dw-halloween .dw-halloween-ember { display: none; } }
@media (max-width: 1200px) { #dw-halloween .dw-halloween-toggle { top: auto; bottom: 8px; } #dw-halloween .dw-halloween-web { width: 70px; height: 70px; } #dw-halloween .dw-halloween-pumpkin { width: 32px; height: 32px; opacity: .3; } #dw-halloween .ghost-2, #dw-halloween .bat-2, #dw-halloween .bat-3, #dw-halloween .bat-5, #dw-halloween .pumpkin-2, #dw-halloween .pumpkin-3, #dw-halloween .dw-halloween-moon, #dw-halloween .dw-halloween-mist { display: none; } }
@media (max-width: 600px) { #dw-halloween .dw-halloween-toggle { left: auto; right: 7px; bottom: 73px; transform: none; min-width: 96px; min-height: 32px; font-size: 10px; opacity: .85; } #dw-halloween .dw-halloween-ghost { width: 26px; height: 34px; opacity: .13; } #dw-halloween .dw-halloween-web { opacity: .12; } #dw-halloween .dw-halloween-bat { opacity: .18; width: 30px; } #dw-halloween .dw-halloween-ember:nth-of-type(n+5) { display: none; } }