.sd { inset: 0; overflow: hidden; pointer-events: none; position: fixed; z-index: 60; }
.sd-bat { height: 26px; left: 0; position: absolute; top: 0; width: 42px; will-change: transform; }
.sd-bat__body { animation: sd-flap .26s infinite; background: url('/stagioni/pipistrello.svg') 0 0 / 200% 100% no-repeat; display: block; height: 100%; width: 100%; }
@keyframes sd-flap {
	0%, 49% { background-position: 0 0; }
	50%, 100% { background-position: 100% 0; }
}
.sd-spider { left: 0; pointer-events: none; position: fixed; top: 0; width: 26px; z-index: 61; }
.sd-spider__thread { background: linear-gradient(rgb(255 255 255 / .1), rgb(255 255 255 / .5)); height: var(--sd-drop, 90px); left: 12.5px; position: absolute; top: 0; transform: scaleY(0); transform-origin: top; width: 1px; }
.sd-spider__body { background: url('/stagioni/ragno.svg') center / contain no-repeat; height: 26px; left: 0; position: absolute; top: 0; width: 26px; }
html[data-theme="light"] .sd-spider__thread { background: rgb(20 13 28 / .45); }
.sd-flake { animation: sd-fall var(--dur) linear var(--delay) infinite; background: radial-gradient(circle, #fff 0 42%, rgb(255 255 255 / 0) 72%); border-radius: 50%; height: var(--size); left: var(--x); opacity: var(--alpha); position: absolute; top: -16px; width: var(--size); will-change: transform; }
.sd-flake--crystal { animation-name: sd-fall-spin; background: #fff; border-radius: 0; mask: url('/stagioni/fiocco.svg') center / contain no-repeat; }
html[data-theme="light"] .sd-flake { background: radial-gradient(circle, #8fa6c7 0 42%, rgb(143 166 199 / 0) 72%); }
html[data-theme="light"] .sd-flake--crystal { background: #8fa6c7; }
@keyframes sd-fall {
	0% { transform: translate3d(0, 0, 0); }
	50% { transform: translate3d(var(--drift), 55vh, 0); }
	100% { transform: translate3d(0, calc(100vh + 32px), 0); }
}
@keyframes sd-fall-spin {
	0% { transform: translate3d(0, 0, 0) rotate(0deg); }
	50% { transform: translate3d(var(--drift), 55vh, 0) rotate(180deg); }
	100% { transform: translate3d(0, calc(100vh + 32px), 0) rotate(360deg); }
}
body:has([data-seasonal="natale"]) .site-logo { position: relative; }
body:has([data-seasonal="natale"]) .site-logo::before { background: url('/stagioni/cappellino.svg') center / contain no-repeat; content: ''; height: 22px; left: -9px; pointer-events: none; position: absolute; top: -9px; transform: rotate(-22deg); width: 27px; z-index: 1; }
@media (prefers-reduced-motion: reduce) {
	.sd { display: none; }
}