.creature-widget{--pet-color:#efae64;display:flex;flex-direction:column;align-items:center;gap:6px;padding:0 0 16px;margin-bottom:14px;border-bottom:1px solid var(--grid-line)}.creature-widget[data-line=squirtle]{--pet-color:#7dcbef}.creature-widget[data-line=bulbasaur]{--pet-color:#9bce86}.creature-heading{display:flex;flex-direction:column;align-items:center;gap:3px}.creature-heading>span{color:var(--pet-color);font-size:9px;text-transform:uppercase;letter-spacing:2px}.creature-heading>strong{font-family:var(--font-title);font-size:18px;color:var(--text-1)}.creature-stage{position:relative;isolation:isolate;width:min(100%,300px);height:220px;display:grid;place-items:center;overflow:hidden;border-radius:18px;background:radial-gradient(ellipse at 50% 75%,color-mix(in srgb,var(--pet-color) 9%,transparent),transparent 68%)}.creature-aura{position:absolute;width:180px;height:150px;bottom:10px;border-radius:50%;background:radial-gradient(ellipse,var(--pet-color),transparent 68%);opacity:.16;pointer-events:none}.creature-shadow{position:absolute;width:110px;height:9px;bottom:20px;border-radius:50%;background:#0005;filter:blur(4px)}.creature-art{position:relative;width:240px;max-width:100%;height:220px;transform-origin:50% 88%;transition:filter .3s}.creature-image{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 6px #0003)}.creature-widget[data-frame=hatchling] .creature-image{width:72%;height:72%;position:absolute;left:14%;bottom:20px}.creature-widget[data-line=bulbasaur][data-frame=egg] .creature-image,.creature-widget[data-line=bulbasaur][data-frame=cracked] .creature-image,.creature-widget[data-line=bulbasaur][data-frame=shell] .creature-image,.creature-choice[data-line=bulbasaur] img{filter:hue-rotate(-80deg) drop-shadow(0 4px 6px #0003)}.creature-caption{font-size:12px;color:var(--text-2-dim);text-align:center;line-height:1.5}.creature-detail,.creature-choice-note{font-size:10px;color:var(--text-3);text-align:center;line-height:1.5;margin:0}.creature-error{font-size:11px;color:var(--neon-magenta);text-align:center;margin:4px 0}.creature-error[hidden]{display:none}.creature-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:100%;margin-top:10px}.creature-choice{font:inherit;display:flex;flex-direction:column;align-items:center;gap:3px;min-width:0;padding:8px 3px;border:1px solid var(--grid-line);border-radius:10px;background:var(--inset);color:var(--text-1);cursor:pointer}.creature-choice:hover,.creature-choice[aria-pressed=true]{border-color:var(--pet-color);background:color-mix(in srgb,var(--pet-color) 10%,var(--inset))}.creature-choice:focus-visible{outline:2px solid var(--pet-color);outline-offset:3px}.creature-choice:disabled{opacity:.55;cursor:wait}.creature-choice img{object-fit:contain;max-width:100%}.creature-choice strong{font-size:11px;font-weight:600}.creature-choice span{font-size:9px;color:var(--text-3)}.creature-unselected h3{margin:8px 0;font-size:17px}.creature-widget[data-loading=true] .creature-art{opacity:.4}.creature-widget[data-health=hungry] .creature-art{filter:saturate(.65)}.creature-widget[data-health=starving] .creature-art{filter:saturate(.35) brightness(.8)}.creature-widget[data-health=dead] .creature-art{filter:grayscale(1) brightness(.5)}.creature-widget[data-health=dead] .creature-aura{opacity:0}.creature-spirit{display:none;position:absolute;left:calc(50% - 9px);bottom:110px;width:18px;height:22px;border-radius:50% 50% 30% 30%;background:radial-gradient(ellipse,#dfedffb3,transparent 70%)}.creature-widget[data-health=dead] .creature-spirit{display:block}@media (prefers-reduced-motion:no-preference){.creature-widget[data-health=healthy] .creature-image{animation:petBreathe 3.2s ease-in-out infinite;transform-origin:50% 88%}.creature-widget[data-health=hungry] .creature-image{animation:petBreathe 5s ease-in-out infinite;transform-origin:50% 88%}.creature-widget[data-stage=egg] .creature-image,.creature-widget[data-frame=egg][data-transition=hatch] .creature-image{animation:petWobble 1.3s ease-in-out infinite;transform-origin:50% 85%}.creature-widget[data-frame=cracked][data-transition=hatch] .creature-image{animation:petWobble .18s ease-in-out infinite}.creature-widget[data-transition=evolve] .creature-aura,.creature-widget[data-frame=shell][data-transition=hatch] .creature-aura{animation:petGlow .65s ease-in-out infinite}.creature-reveal{animation:petReveal .45s ease-out both}.creature-widget[data-health=dead] .creature-image,.creature-widget[data-health=starving] .creature-image{animation:none}.creature-widget[data-health=dead] .creature-spirit{animation:petSpirit 3s ease-out infinite}}@media (prefers-reduced-motion:reduce){.creature-art{transition:none}}@media (max-width:400px){.creature-choices{gap:5px}.creature-choice strong{font-size:10px}.creature-stage{width:100%}}@keyframes petBreathe{0%,to{transform:scale(1)}50%{transform:scale(1.018) translateY(-2px)}}@keyframes petWobble{0%,to{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}@keyframes petGlow{0%,to{opacity:.2;transform:scale(1)}50%{opacity:.8;transform:scale(1.45)}}@keyframes petReveal{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}@keyframes petSpirit{0%{transform:translateY(0);opacity:.7}to{transform:translateY(-55px);opacity:0}}
