/* Ambient life stays continuous across idle, fetching, Roll and result. The original
   Figma Roll choreography remains on the creature and face during .rolling. */
.scene .smoke-layer{animation:smoke-roll 8s ease-in-out infinite!important;transform-origin:center;will-change:transform,opacity;translate:none;scale:none;opacity:.36}
.scene .smoke-layer:nth-child(2){animation-name:smoke-counter!important;animation-duration:10s!important;animation-delay:-4s!important}
.scene .smoke-layer:nth-child(3){animation-duration:7s!important;animation-delay:-3s!important;mix-blend-mode:screen}
.scene .smoke-layer:nth-child(4){animation-name:smoke-rise!important;animation-duration:9s!important;animation-delay:-6s!important}
@keyframes smoke-roll{0%,100%{transform:translate(-8%,-12%) rotate(-7deg) scale(1.08,.92);opacity:.3}50%{transform:translate(16%,10%) rotate(8deg) scale(1.25,1.35);opacity:.55}}
@keyframes smoke-counter{0%,100%{transform:translate(10%,15%) rotate(7deg) scale(1.1,1.25);opacity:.42}50%{transform:translate(-15%,-18%) rotate(-9deg) scale(1.28,.95);opacity:.28}}
@keyframes smoke-rise{0%,100%{transform:translate(12%,12%) rotate(9deg) scale(.95,1.05);opacity:.28}50%{transform:translate(-28%,-16%) rotate(-14deg) scale(1.45,1.2);opacity:.5}}
.scene:is(.idle,.pending) .creature-rig{animation:creature-breathe 4.8s ease-in-out infinite;transform:none;translate:none;scale:none}
@keyframes creature-breathe{0%,100%{transform:translateY(0) rotate(-.6deg)}50%{transform:translateY(-4px) rotate(.6deg)}}
.scene:is(.idle,.pending) .face-rig{animation:face-look 7.4s cubic-bezier(.45,0,.25,1) infinite;transform:none;translate:none;scale:none}
@keyframes face-look{0%,100%{transform:translate(-6px,1px) rotate(-2deg)}24%{transform:translate(9px,-5px) rotate(2deg)}48%{transform:translate(3px,5px) rotate(-1deg)}74%{transform:translate(-10px,-3px) rotate(-3deg)}}
.scene:is(.idle,.pending) .face-part{animation:none!important;translate:none;scale:none;transform:none;transition:transform .65s cubic-bezier(.2,.7,.25,1),opacity .45s ease}
.scene:is(.idle,.pending) .face-part:is([data-motion="36:103"],[data-motion="36:104"]){animation:alive-blink 4.3s linear infinite!important}
.scene:is(.idle,.pending) [data-motion="36:104"]{animation-delay:-.035s!important}
@keyframes alive-blink{0%,39%,44%,77%,82%,100%{scale:1 1}41%,79%{scale:1 .08}}
.scene:is(.idle,.pending)[data-expression=happy] :is([data-motion="36:103"],[data-motion="36:104"]){transform:translateY(8px) scale(1,.65)}
.scene:is(.idle,.pending)[data-expression=happy] [data-motion="36:105"]{transform:scale(1.32,1.25)}
.scene:is(.idle,.pending)[data-expression=happy] :is([data-motion="51:188"],[data-motion="51:189"]){opacity:.6}
.scene:is(.idle,.pending)[data-expression=sad] [data-motion="36:105"]{transform:translateY(3px) rotate(180deg) scale(.85,1.1)}
.scene:is(.idle,.pending)[data-expression=sad] [data-motion="51:185"]{opacity:.8;transform:rotate(-20deg) translateY(4px)}
.scene:is(.idle,.pending)[data-expression=sad] [data-motion="51:186"]{opacity:.8;transform:rotate(20deg) translateY(4px)}
.scene:is(.idle,.pending)[data-expression=mad] [data-motion="51:185"]{opacity:1;transform:translateY(9px) rotate(25deg)}
.scene:is(.idle,.pending)[data-expression=mad] [data-motion="51:186"]{opacity:1;transform:translateY(9px) rotate(-25deg)}
.scene:is(.idle,.pending)[data-expression=mad] [data-motion="36:105"]{transform:translateY(3px) scale(.8,.35)}
.scene:is(.idle,.pending)[data-expression=surprised] [data-motion="36:105"]{opacity:0}
.scene:is(.idle,.pending)[data-expression=surprised] [data-motion="51:187"]{opacity:1;transform:scale(1.1)}
.scene:is(.idle,.pending)[data-expression=surprised] :is([data-motion="36:103"],[data-motion="36:104"]){transform:scale(1.1,1.12)}
.scene:is(.idle,.pending)[data-expression=surprised] :is([data-motion="51:185"],[data-motion="51:186"]){opacity:.8;transform:translateY(-8px)}
.scene:is(.idle,.pending)[data-expression=curious] [data-motion="51:185"]{opacity:.9;transform:translateY(-9px) rotate(-12deg)}
.scene:is(.idle,.pending)[data-expression=curious] [data-motion="36:105"]{transform:translateX(5px) rotate(-12deg) scale(.9)}
/* Keep the exact face contour; inset the picture and retain its native aspect ratio. */
.scene .game-display{background:transparent}
.scene .game-display>img{inset:8%;width:84%;height:84%;object-fit:contain;object-position:center;border-radius:12px}
html[data-motion-mode=reduced] #pickerView *{animation:none!important;transition:none!important}
html[data-motion-mode=reduced] .scene :is(.smoke-layer,.creature-rig,.face-rig,.face-part){transform:none;scale:none;translate:none}
html[data-motion-mode=reduced] .scene .smoke-layer{opacity:.18!important}
@media(max-width:800px){.header-actions #motionToggle{font-size:10px;padding:4px 8px}.header-actions{display:flex;align-items:center}.header-actions #donate{display:none}}