.jj-snow{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:3}
.jj-flake{position:absolute;top:-16px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-12 -12 24 24'%3E%3Cg stroke='%234FA3D9' stroke-width='2.6' stroke-linecap='round' fill='none'%3E%3Cg id='a'%3E%3Cpath d='M0-10V10M0-7l-3-3M0-7l3-3M0 7l-3 3M0 7l3 3'/%3E%3C/g%3E%3Cuse href='%23a' transform='rotate(60)'/%3E%3Cuse href='%23a' transform='rotate(120)'/%3E%3C/g%3E%3Cg stroke='%237EC8F0' stroke-width='1.4' stroke-linecap='round' fill='none'%3E%3Cuse href='%23a'/%3E%3Cuse href='%23a' transform='rotate(60)'/%3E%3Cuse href='%23a' transform='rotate(120)'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat;opacity:.85;will-change:transform;animation:jj-fall linear infinite}
@keyframes jj-fall{to{transform:translate3d(var(--dx),105vh,0) rotate(220deg)}}
.jj-garland{position:absolute;left:0;right:0;top:100%;height:26px;pointer-events:none;z-index:4;overflow:visible}
.jj-garland svg.jj-wire{position:absolute;inset:0 0 auto;width:100%;height:14px}
.jj-bulb{position:absolute;top:2px;width:10px;height:14px;margin-left:-5px;border-radius:50% 50% 45% 45%/40% 40% 60% 60%;pointer-events:auto;cursor:pointer;transform-origin:50% -3px;animation:jj-glow 2.4s ease-in-out infinite;transition:transform .2s}
.jj-bulb:before{content:"";position:absolute;top:-4px;left:2px;width:6px;height:4px;background:#2F6B4F;border-radius:2px}
.jj-bulb.r{background:#C8323C;--g:#C8323C}.jj-bulb.p{background:#8E5BD9;--g:#8E5BD9}.jj-bulb.g{background:#2F6B4F;--g:#2F6B4F}.jj-bulb.k{background:#F3A6C8;--g:#F3A6C8}
.jj-bulb.sway{animation:jj-sway .9s ease-out,jj-glow 2.4s ease-in-out infinite}
@keyframes jj-glow{50%{box-shadow:0 0 8px 2px var(--g);filter:brightness(1.25)}}
@keyframes jj-sway{0%{transform:rotate(0)}20%{transform:rotate(22deg)}45%{transform:rotate(-16deg)}70%{transform:rotate(8deg)}100%{transform:rotate(0)}}
@media (prefers-reduced-motion:reduce){.jj-snow{display:none}.jj-bulb,.jj-bulb.sway{animation:none}}
