/* ---------- Oto rig ---------- */
.oto-svg{display:block;width:100%;height:100%;overflow:visible;--lx:0;--ly:0}
.oto-svg *{transform-box:view-box}
.oto-svg .o-shadow ellipse{fill:rgba(0,0,0,.42);transform-origin:100px 150px;transition:transform .3s ease}
.oto-svg .o-rig{transform-origin:100px 150px}
.oto-svg .body{fill:#DBB690}.oto-svg .haunch{fill:#D2AC84}.oto-svg .chest{fill:#E6C7A3}
.oto-svg .o-paws ellipse{fill:#D9B48C;opacity:0;transition:opacity .25s}
.oto-svg .o-leg rect,.oto-svg .o-leg ellipse{fill:#D9B48C}
.oto-svg .o-leg-bf rect,.oto-svg .o-leg-bf ellipse,.oto-svg .o-leg-ff rect,.oto-svg .o-leg-ff ellipse{fill:#B38D68}
.oto-svg .o-leg-bn{transform-origin:62px 124px}.oto-svg .o-leg-bf{transform-origin:75px 122px}
.oto-svg .o-leg-fn{transform-origin:137px 122px}.oto-svg .o-leg-ff{transform-origin:124px 121px}
.oto-svg .o-tail{transform-origin:53px 86px}
.oto-svg .o-tail path{fill:none;stroke:#D5AE85;stroke-width:9.5;stroke-linecap:round}
.oto-svg .o-body{transform-origin:60px 134px}
.oto-svg .o-head{transform-origin:134px 104px}
.oto-svg .o-face{transform:translate(calc(var(--lx) * 2.4px),calc(var(--ly) * 1.2px)) rotate(calc(var(--lx) * 2.5deg));transform-origin:150px 100px;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.oto-svg .skull{fill:#E1BF99}.oto-svg .cheek{fill:#D6B089}
.oto-svg .ear{fill:#2A201B;transition:transform .25s ease}
.oto-svg .ear-l{transform-origin:123px 44px}.oto-svg .ear-r{transform-origin:177px 44px}
.oto-svg .wrinkles path{fill:none;stroke:#8F6A4B;stroke-width:2.2;stroke-linecap:round;opacity:.55}
.oto-svg .mask{fill:#2B211C}
.oto-svg .eye-ring{fill:#4A3930}.oto-svg .eye-ball{fill:#1E1511}.oto-svg .iris{fill:#2C1C14}
.oto-svg .glint{fill:#FFF7EC}.oto-svg .glint2{fill:#FFF7EC;opacity:.72}
.oto-svg .pupil{transform:translate(calc(var(--lx) * 2.3px),calc(var(--ly) * 1.9px));transition:transform .18s ease-out}
.oto-svg .lid{fill:#3A2C25;transform:scaleY(0);transition:transform .07s ease-in}
.oto-svg .eye-l .lid{transform-origin:135px 60.4px}.oto-svg .eye-r .lid{transform-origin:165px 60.4px}
.oto-svg .lash{fill:none;stroke:#120c0a;stroke-width:2.1;stroke-linecap:round;opacity:0}
.oto-svg .roll{fill:none;stroke:#473730;stroke-width:2.4;stroke-linecap:round}
.oto-svg .nose{fill:#100B09}.oto-svg .nose-hi{fill:none;stroke:#3d302b;stroke-width:1.2;stroke-linecap:round}
.oto-svg .o-nose{transform-origin:150px 88px}
.oto-svg .mouth{fill:none;stroke:#0E0908;stroke-width:2;stroke-linecap:round}
.oto-svg .tongue{fill:#E3897F;transform-origin:150.6px 96.5px;transform:scaleY(0);transition:transform .18s cubic-bezier(.3,1.4,.5,1)}
.oto-svg .yawn{fill:#3a1714;opacity:0;transform-origin:150px 95px;transform:scaleY(.2)}
.oto-svg .o-carry{opacity:0;transform-origin:151px 100px;transform:scale(.4) rotate(-8deg);transition:opacity .15s,transform .3s cubic-bezier(.2,.8,.2,1)}
.oto-svg .carry-card rect{fill:#F2EADF}
.oto-svg.is-carrying .o-carry{opacity:1;transform:rotate(-7deg)}
.oto-svg.is-carrying .mouth,.oto-svg.is-carrying .tongue{opacity:0}

/* blink & micro life */
.oto-svg.wag .o-tail{animation:o-wag-fast .3s linear infinite}
.oto-svg.boop .o-nose{transform:scale(.82,.9)}
.oto-svg .o-nose{transition:transform .12s ease}
.oto-svg.blink .lid{transform:scaleY(1)}.oto-svg.blink .lash{opacity:1}
.oto-svg.blep .tongue,.oto-svg.is-run .tongue,.oto-svg.is-celebrate .tongue,.oto-svg.is-bow .tongue{transform:scaleY(1)}
.oto-svg.ear-flick .ear-r{animation:o-earflick .42s ease}
@keyframes o-earflick{30%{transform:rotate(-18deg)}60%{transform:rotate(6deg)}}

@media (prefers-reduced-motion:no-preference){
  .oto-svg .o-rig{animation:o-breathe 3.6s ease-in-out infinite}
  .oto-svg .o-tail{animation:o-wag 1.9s ease-in-out infinite}
}
@keyframes o-breathe{0%,100%{transform:scale(1,1)}50%{transform:scale(1.008,1.018)}}
@keyframes o-wag{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(9deg)}}
@keyframes o-wag-fast{0%,100%{transform:rotate(-14deg)}50%{transform:rotate(18deg)}}

/* walk */
.oto-svg.is-walk .o-rig{animation:o-bob .5s ease-in-out infinite}
.oto-svg.is-walk .o-leg-bn,.oto-svg.is-walk .o-leg-ff{animation:o-step .5s ease-in-out infinite}
.oto-svg.is-walk .o-leg-bf,.oto-svg.is-walk .o-leg-fn{animation:o-step .5s ease-in-out infinite reverse}
.oto-svg.is-walk .o-head{animation:o-headbob .5s ease-in-out infinite}
.oto-svg.is-walk .o-tail{animation:o-wag-fast .5s ease-in-out infinite}
@keyframes o-step{0%,100%{transform:rotate(-20deg)}50%{transform:rotate(20deg)}}
@keyframes o-bob{0%,50%,100%{transform:translateY(0)}25%,75%{transform:translateY(-2.2px)}}
@keyframes o-headbob{0%,50%,100%{transform:rotate(0)}25%,75%{transform:rotate(-2deg) translateY(-1px)}}

/* run (gallop) */
.oto-svg.is-run .o-rig{animation:o-gallop .32s ease-in-out infinite}
.oto-svg.is-run .o-leg-bn,.oto-svg.is-run .o-leg-bf{animation:o-kick .32s ease-in-out infinite}
.oto-svg.is-run .o-leg-fn,.oto-svg.is-run .o-leg-ff{animation:o-reach .32s ease-in-out infinite}
.oto-svg.is-run .o-tail{animation:o-wag-fast .28s linear infinite}
.oto-svg.is-run .ear-l{transform:rotate(22deg)}.oto-svg.is-run .ear-r{transform:rotate(-26deg)}
.oto-svg.is-run .o-shadow ellipse{animation:o-shadow .32s ease-in-out infinite}
@keyframes o-gallop{0%,100%{transform:translateY(0) rotate(0)}30%{transform:translateY(-9px) rotate(-5deg)}65%{transform:translateY(-4px) rotate(4deg)}}
@keyframes o-kick{0%,100%{transform:rotate(34deg)}50%{transform:rotate(-30deg)}}
@keyframes o-reach{0%,100%{transform:rotate(-36deg)}50%{transform:rotate(28deg)}}
@keyframes o-shadow{30%{transform:scaleX(.8);opacity:.6}}

/* sit */
.oto-svg.is-sit .o-body{transform:rotate(-11deg) translate(6px,0)}
.oto-svg.is-sit .o-body .haunch{transform:translate(4px,6px) scale(1.18);transform-origin:64px 110px}
.oto-svg.is-sit .o-leg-bn,.oto-svg.is-sit .o-leg-bf{opacity:0}
.oto-svg.is-sit .paw-sit{opacity:1}
.oto-svg.is-sit .o-leg-fn{transform:translate(-6px,-1px) rotate(-3deg)}
.oto-svg.is-sit .o-leg-ff{transform:translate(-6px,-1px)}
.oto-svg.is-sit .o-head{transform:translate(-8px,-11px)}
.oto-svg.is-sit .o-tail{transform:translate(6px,34px) rotate(40deg)}
.oto-svg .o-leg{transition:transform .38s cubic-bezier(.2,.8,.2,1),opacity .2s}
.oto-svg .o-body .haunch{transition:transform .38s cubic-bezier(.2,.8,.2,1)}
.oto-svg .o-body,.oto-svg .o-head,.oto-svg .o-leg,.oto-svg .o-tail{transition:transform .38s cubic-bezier(.2,.8,.2,1)}

/* sleep */
.oto-svg.is-sleep .o-rig{animation:o-sleepbreath 4.2s ease-in-out infinite}
.oto-svg.is-sleep .o-body{transform:translateY(12px) scaleY(.84)}
.oto-svg.is-sleep .o-leg{transform:translateY(8px) scaleY(.18);opacity:0}
.oto-svg.is-sleep .paw-sleep{opacity:1}
.oto-svg.is-sleep .o-head{transform:translate(6px,28px) rotate(-7deg)}
.oto-svg.is-sleep .lid{transform:scaleY(1);transition-duration:.35s}
.oto-svg.is-sleep .lash{opacity:1;transition:opacity .2s .25s}
.oto-svg.is-sleep .o-tail{animation:none;transform:translate(6px,14px) rotate(-18deg)}
.oto-svg.is-sleep .ear-l{transform:rotate(12deg)}.oto-svg.is-sleep .ear-r{transform:rotate(-12deg)}
@keyframes o-sleepbreath{0%,100%{transform:scale(1,1)}50%{transform:scale(1.012,1.035)}}

/* sniff */
.oto-svg.is-sniff .o-head{transform:translate(5px,14px) rotate(9deg)}
.oto-svg.is-sniff .o-nose{animation:o-sniff .2s ease-in-out infinite}
.oto-svg.is-sniff .o-tail{animation:o-wag-fast .6s ease-in-out infinite}
@keyframes o-sniff{50%{transform:scale(1.12,.9)}}

/* surprise */
.oto-svg.is-surprise .o-rig{animation:o-hop .45s cubic-bezier(.2,.8,.2,1)}
.oto-svg.is-surprise .ear-l{transform:rotate(26deg) translateY(-4px)}.oto-svg.is-surprise .ear-r{transform:rotate(-26deg) translateY(-4px)}
.oto-svg.is-surprise .pupil{transform:scale(1.12)}
.oto-svg.is-surprise .eye-l .pupil{transform-origin:135.6px 72.4px}.oto-svg.is-surprise .eye-r .pupil{transform-origin:165.6px 72.4px}
@keyframes o-hop{0%{transform:translateY(0) scale(1,1)}25%{transform:translateY(1px) scale(1.04,.94)}55%{transform:translateY(-12px) scale(.97,1.04)}100%{transform:translateY(0) scale(1,1)}}

/* celebrate */
.oto-svg.is-celebrate .o-rig{animation:o-celebrate .9s cubic-bezier(.2,.8,.2,1)}
.oto-svg.is-celebrate .o-tail{animation:o-wag-fast .22s linear infinite}
@keyframes o-celebrate{0%{transform:translateY(0)}18%{transform:translateY(2px) scale(1.03,.95)}40%{transform:translateY(-18px) rotate(-6deg)}60%{transform:translateY(0) scale(1.03,.96)}75%{transform:translateY(-8px) rotate(4deg)}100%{transform:translateY(0)}}

/* play bow */
.oto-svg.is-bow .o-body{transform:rotate(10deg) translate(2px,-2px)}
.oto-svg.is-bow .o-head{transform:translate(4px,14px)}
.oto-svg.is-bow .o-leg-fn,.oto-svg.is-bow .o-leg-ff{transform:translate(6px,4px) rotate(-38deg) scaleY(.86)}
.oto-svg.is-bow .o-tail{animation:o-wag-fast .24s linear infinite}

/* head tilt / look up / yawn */
.oto-svg.is-tilt .o-head{transform:rotate(-13deg) translate(-2px,-2px)}
.oto-svg.is-look-up .o-head{transform:translate(-2px,-6px) rotate(-6deg)}
.oto-svg.is-look-up .pupil{transform:translate(0,-2.4px)}
.oto-svg.is-yawn .yawn{opacity:1;transform:scaleY(1);transition:transform .5s ease,opacity .1s}
.oto-svg.is-yawn .lid{transform:scaleY(1);transition-duration:.3s}
.oto-svg.is-yawn .lash{opacity:1}
.oto-svg.is-yawn .mouth{opacity:0}
.oto-svg.is-yawn .o-head{transform:rotate(-8deg) translate(-2px,-4px)}

@media (prefers-reduced-motion:reduce){
  .oto-svg *,.oto-svg{animation:none!important;transition-duration:.01ms!important}
}