:root{font:16px ui-rounded,"Microsoft JhengHei","PingFang TC",sans-serif;color:#514537;background:#fff6eb;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top left,#ffe7ce,transparent 55%),#fff6eb}button{font:inherit;cursor:pointer;color:inherit;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:3px solid #496caf;outline-offset:2px}button:disabled{cursor:wait;opacity:.6}[hidden]{display:none!important}
.app{width:min(100%,580px);height:100svh;min-height:600px;max-height:1060px;margin:auto;padding:max(12px,env(safe-area-inset-top)) 16px max(10px,env(safe-area-inset-bottom));display:grid;grid-template-rows:60px minmax(290px,1fr) 83px 74px 20px;gap:12px}
header{display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:10px}.brand>span{font-size:26px;width:44px;height:44px;display:grid;place-items:center;background:#fff;border-radius:16px}h1{font-size:22px;line-height:1.3;margin:0}.brand p{font-size:12px;color:#96836a;margin:4px 0 0;letter-spacing:.07em}#sound{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border:1px solid #e9ddce;background:#ffffff99;border-radius:18px;min-width:54px;height:54px}#sound>span{font-size:24px}#sound small{font-size:12px}#sound[aria-pressed=true]{background:#ffe9b9}
.room{position:relative;isolation:isolate;overflow:hidden;min-height:0;border:3px solid #fff;border-radius:30px;background:#edf2e3 url("room.png") center/100% 100% no-repeat;box-shadow:0 6px 0 #e6dbcc;touch-action:none;user-select:none;-webkit-user-select:none}
.room:after{content:"";position:absolute;inset:0;background:#14223d;opacity:0;transition:opacity .7s;pointer-events:none;z-index:0}.room.sleeping:after{opacity:.57}
.room-top{position:absolute;left:13px;right:13px;top:12px;display:flex;justify-content:space-between;align-items:flex-start;z-index:8;pointer-events:none;gap:8px}.name{padding:7px 11px;border-radius:14px;background:#ffffffeb;font-size:15px;font-weight:800}.name>span{display:block;font-size:11px;color:#7b8a83;font-weight:400;margin-top:2px}.wish{display:flex;align-items:center;gap:6px;background:#fff7dfef;border:1px solid #fff;border-radius:18px;padding:6px 10px;font-size:12px;max-width:56%}.wish b{font-size:28px;line-height:1}.wish>span:first-child{color:#a58456}.speech{position:absolute;top:77px;left:50%;transform:translateX(-50%);z-index:8;background:#ffffffef;padding:10px 15px;border-radius:18px;text-align:center;font-size:16px;font-weight:800;line-height:1.4;max-width:93%;width:max-content;box-shadow:0 3px 0 #6c6a5012;pointer-events:none}.speech:after{content:"";position:absolute;bottom:-7px;left:48%;border-top:8px solid white;border-left:8px solid transparent;border-right:8px solid transparent}
.sunlight{position:absolute;inset:0;background:linear-gradient(125deg,transparent 44%,#fff3c930 50%,transparent 59%);background-size:200% 100%;animation:sunshift 14s ease-in-out infinite;pointer-events:none}
.scene-button{position:absolute;min-width:58px;min-height:44px;padding:6px 8px;background:#ffffffcd;border:2px solid #fff;border-radius:15px;z-index:4;font-size:14px;font-weight:800;box-shadow:0 3px 0 #57431b16}.scene-button.platform{left:3%;top:47%}.scene-button.bed{right:2%;bottom:12%}.room.sleeping .scene-button{background:#e5eafad9}
.actor{position:absolute;left:51%;bottom:13%;width:67%;aspect-ratio:1/1.13;z-index:3;transform:translateX(-50%);transition:left .8s ease,bottom .8s ease,width .8s ease;transform-origin:50% 90%;pointer-events:none}
.actor[data-location=platform]{left:22%;bottom:38%;width:46%}.actor[data-location=bed]{left:78%;bottom:12%;width:44%}
.actor:before{content:"";position:absolute;bottom:3%;left:18%;width:65%;height:7%;border-radius:50%;background:#73512620;filter:blur(5px)}
.sprite-head{background-image:url("heads.png");background-size:300% 200%;background-repeat:no-repeat;width:100%;height:100%}.sprite-part{background-image:url("body-parts.png");background-size:200% 200%;background-repeat:no-repeat;width:100%;height:100%}
.head-motion{position:absolute;left:5%;top:-3%;width:86%;aspect-ratio:1;z-index:3;transform-origin:50% 80%;transform:rotate(var(--head-turn,0deg))}.body-motion{position:absolute;left:11%;top:39%;width:77%;aspect-ratio:1;z-index:2;transform-origin:50% 80%}.tail-motion{position:absolute;left:48%;top:45%;width:63%;aspect-ratio:1;z-index:1;transform-origin:28% 81%}.body{background-position:0 0}.tail{background-position:0 100%}.head{background-position:0 0}
.hit{position:absolute;z-index:6;border:0;background:transparent;pointer-events:auto;touch-action:none;min-width:44px;min-height:44px;border-radius:35%}.head-hit{left:19%;top:11%;width:54%;height:31%}.belly-hit{left:27%;top:48%;width:38%;height:24%}.paws-hit{left:26%;top:74%;width:41%;height:20%}.tail-hit{left:73%;top:52%;width:24%;height:30%}.hit:focus-visible{background:#ffffff20}.actor-return{position:absolute;inset:10%;border:0;background:transparent;z-index:7;pointer-events:auto;min-width:60px;min-height:60px}
.fur-effects{position:absolute;inset:0;pointer-events:none;z-index:4}.fur-bubble{position:absolute;border:2px solid #fff9;background:radial-gradient(circle at 25% 25%,#fff 0,#f0fcffee 38%,#c6ebeead 100%);border-radius:50%;box-shadow:inset -3px -2px 5px #97c4d742;animation:foambob 2s ease-in-out infinite}.drop{position:absolute;width:7px;height:15px;background:#80c7efb3;border:1px solid #e2f8ff;border-radius:60% 60% 65% 65%;animation:drip 1.5s linear infinite}
.effects{position:absolute;inset:0;pointer-events:none;z-index:7;overflow:hidden}.spark{position:absolute;left:var(--x);top:var(--y);font-size:var(--size,25px);color:#ef8d8d;animation:floatup 2s ease-out both;animation-delay:var(--delay,0s)}.eating{position:absolute;left:44%;top:54%;font-size:38px;animation:munch .65s ease-in-out 3}.sleep-z{position:absolute;left:73%;top:58%;font-size:22px;letter-spacing:4px;color:#fff9de;animation:foambob 2s infinite}.water-stream{position:absolute;left:46%;top:35%;width:28%;height:42%;background:repeating-linear-gradient(100deg,transparent 0 9px,#aeeaffbb 10px 13px,transparent 14px 20px);transform:rotate(-10deg);animation:stream .25s linear infinite;mask-image:linear-gradient(transparent,#000 20%,#000 80%,transparent)}.wind{position:absolute;left:34%;top:53%;font-size:60px;animation:blow .65s linear infinite;opacity:.8}
.tool-ghost{position:absolute;left:50%;top:58%;z-index:10;font-size:46px;line-height:1;pointer-events:none;transform:translate(-50%,-65%);filter:drop-shadow(0 3px 3px #63432140)}.tool-ghost svg{width:60px;height:60px}
.wand{position:absolute;left:58%;top:46%;width:130px;height:120px;z-index:9;pointer-events:none;transform:translate(-50%,-50%)}.wand-stick{position:absolute;left:60%;top:0;width:7px;height:82px;border-radius:5px;background:#9f769d;transform:rotate(35deg);transform-origin:top}.wand-string{position:absolute;left:37%;top:44%;width:1px;height:38px;background:#927985;transform:rotate(-20deg)}.feather{position:absolute;left:9%;top:63%;font-size:37px;transform-origin:top;animation:feather .75s ease-in-out infinite}
.play-ball{position:absolute;left:72%;top:61%;z-index:6;font-size:42px;line-height:1;transform:translate(-50%,-50%);filter:drop-shadow(0 4px 2px #5c402740);pointer-events:none;animation:ballroll .7s ease-in-out infinite alternate}.play-object{position:absolute;z-index:6;display:grid;place-items:center;border:3px solid #fff;background:#fff9dfdb;box-shadow:0 4px 0 #72523848;min-width:58px;min-height:58px;padding:4px;line-height:1}.play-box{right:22%;bottom:8%;width:88px;height:76px;border-radius:20px;font-size:52px}.bird-toy{right:7%;top:29%;width:62px;height:62px;border-radius:50%;font-size:35px}.bird-toy span{display:block;animation:birdbob 1.3s ease-in-out infinite}.blanket-toy{left:7%;bottom:8%;width:84px;height:62px;border-radius:24px;font-size:42px}.actor[data-hiding=true]{left:66%;bottom:-2%;width:min(39%,39cqh);z-index:4}.actor[data-hiding=true] .body-motion,.actor[data-hiding=true] .limbs,.actor[data-hiding=true] .tail-motion{opacity:.12}.actor[data-reaction=hide] .head-motion{animation:boxhide .8s ease-in-out both}.actor[data-reaction=peek] .head-motion{animation:boxpeek .7s ease-in-out 2}.actor[data-reaction=ball]{animation:ballpounce .85s ease-in-out 2}.actor[data-reaction=bird] .head-motion{animation:birdlook .45s ease-in-out 4}.actor[data-reaction=bird] .forepaw{animation:pawreach .38s ease-in-out 4}.actor[data-reaction=burrow]{animation:blanketburrow 1.2s ease-in-out}.actor[data-reaction=burrow] .tail-motion{animation:tailwag .28s ease-in-out 5}
.room-hint{position:absolute;bottom:8px;left:12px;right:12px;z-index:8;text-align:center;font-size:12px;padding:6px 8px;color:#6f7164;background:#ffffffd9;border-radius:12px;pointer-events:none}
.tool-tray{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;min-width:0}.tool-tray[data-count="4"]{grid-template-columns:repeat(4,1fr);gap:7px}.tool-tray[data-count="5"]{grid-template-columns:repeat(5,1fr);gap:4px}.tool-tray[data-count="1"]{grid-template-columns:1fr}.choice{border:2px solid #fff;background:#fffdf8;border-radius:21px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:14px;font-weight:700;padding:5px;min-height:64px;box-shadow:0 3px 0 #e7dac7;position:relative}.choice>span:first-child{font-size:30px;line-height:1.1}.tool-tray[data-count="5"] .choice{font-size:12px;padding:4px 2px}.tool-tray[data-count="5"] .choice>span:first-child{font-size:26px}.choice svg{width:34px;height:32px}.choice[aria-pressed=true]{border-color:#e7ac66;background:#fff0d8;box-shadow:0 3px 0 #e2c497}.choice .wanted{position:absolute;right:4px;top:3px;font-size:10px!important;background:#f9d88f;border-radius:6px;padding:2px 3px;color:#8b6130}
.tray-message{grid-column:1/-1;min-width:0;background:#ffffff90;border:1px solid #fff;border-radius:20px;display:flex;align-items:center;justify-content:center;gap:12px;font-size:15px;line-height:1.6;padding:10px 15px}.tray-message>span:first-child{font-size:30px;flex-shrink:0}.tray-message>span:last-child{min-width:0}
.activities{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.activities button{border:2px solid white;border-radius:20px;background:#efe6dc;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;font-size:15px;font-weight:800;box-shadow:0 4px 0 #dfd2c0;padding:5px}.activities button>span{font-size:28px;line-height:1}.activities button:nth-child(1){background:#ffe3de}.activities button:nth-child(2){background:#ffecc2}.activities button:nth-child(3){background:#d9edf8}.activities button:nth-child(4){background:#e2efdb}.activities button:nth-child(5){background:#eae0f6}.activities button[aria-pressed=true]{border-color:#9e8b70;box-shadow:0 4px 0 #baa788;transform:translateY(-1px)}.activities button:active{transform:translateY(2px)}
footer{text-align:center;color:#988974;font-size:11px;line-height:20px;white-space:nowrap}
.loading{position:absolute;inset:0;background:#edf3e8;z-index:20;display:grid;place-content:center;text-align:center;gap:16px;padding:20px;color:#638073}.loading button{border:0;background:white;border-radius:15px;padding:14px;font-size:16px}
.actor[data-reaction=headshake] .head-motion{animation:headshake .55s ease-in-out 4}.actor[data-reaction=tailwag] .tail-motion{animation:tailwag .4s ease-in-out 6}.actor[data-reaction=belly] .body-motion,.actor[data-reaction=brush] .body-motion{animation:belly .4s ease-in-out 5}.actor[data-reaction=belly] .head-motion{animation:headshake .6s ease-in-out 3}
.actor[data-reaction=paws] .body-motion,.actor[data-reaction=chase] .body-motion{animation:pawhop .4s ease-in-out 4}.actor[data-reaction=chase] .head-motion{animation:headshake .45s ease-in-out 3}.actor[data-reaction=eat] .head-motion{animation:nibble .4s ease-in-out 6}.actor[data-reaction=dry] .head-motion{animation:headshake .18s ease-in-out 10}.actor[data-reaction=rinse] .body-motion{animation:belly .3s ease-in-out 4}.actor[data-reaction=spin]{animation:spin 2.4s ease-in-out}.actor[data-reaction=ask] .body-motion{animation:pawhop .7s ease-in-out 3}.actor[data-reaction=yawn] .head-motion{animation:yawn 2.8s ease-in-out}.actor[data-reaction=sleep] .body-motion{animation:breathe 3s ease-in-out infinite}.actor[data-reaction=sleep] .head-motion{transform:rotate(12deg);top:5%}
@keyframes headshake{0%,100%{transform:rotate(0deg)}30%{transform:rotate(-8deg)}70%{transform:rotate(8deg)}}@keyframes tailwag{0%,100%{transform:rotate(-15deg)}50%{transform:rotate(20deg)}}
@keyframes belly{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}@keyframes pawhop{0%,100%{transform:translateY(0)}50%{transform:translateY(-9%)}}@keyframes nibble{0%,100%{transform:translateY(0)}50%{transform:translateY(3%) scale(.98)}}@keyframes spin{0%{transform:translateX(-50%) rotateY(0deg)}50%{transform:translateX(-40%) rotateY(180deg) translateY(-15px)}100%{transform:translateX(-50%) rotateY(360deg)}}
@keyframes yawn{0%,100%{transform:rotate(0) scale(1)}40%,70%{transform:rotate(-5deg) scale(1.08)}}@keyframes breathe{50%{transform:scale(1.03)}}@keyframes foambob{50%{transform:translateY(-4px)}}@keyframes drip{to{transform:translateY(30px);opacity:0}}@keyframes floatup{from{opacity:1;transform:scale(.7)}to{opacity:0;transform:translateY(-80px) scale(1.2)}}@keyframes munch{50%{transform:translateY(-20px) scale(.75)}}@keyframes stream{to{background-position:6px 18px}}@keyframes blow{from{transform:translateX(-12px);opacity:0}50%{opacity:1}to{transform:translateX(35px);opacity:0}}@keyframes feather{50%{transform:rotate(20deg)}}@keyframes sunshift{50%{background-position:100% 0}}
@keyframes ballroll{to{transform:translate(-50%,-50%) rotate(22deg) translateX(5px)}}@keyframes birdbob{50%{transform:translateY(-6px) rotate(5deg)}}@keyframes boxhide{to{transform:translateY(34%) scale(.75)}}@keyframes boxpeek{50%{transform:translateY(-14%) rotate(7deg)}}@keyframes ballpounce{40%{transform:translateX(-50%) translateY(-15%) scale(.9)}70%{transform:translateX(-50%) translateY(3%) scale(1.04)}}@keyframes birdlook{50%{transform:rotate(-13deg) translateY(-3%)}}@keyframes blanketburrow{45%{transform:translateX(-62%) translateY(12%) scale(.78)}75%{transform:translateX(-42%) translateY(-10%) scale(1.04)}}
@media(max-width:370px){.app{padding-left:10px;padding-right:10px;gap:8px;grid-template-rows:52px minmax(285px,1fr) 75px 67px 18px;min-height:580px}h1{font-size:20px}.brand p{font-size:11px}.speech{top:68px;font-size:14px;padding:8px 10px}.room-top{top:8px;left:8px;right:8px}.room-hint{font-size:11px}.choice{font-size:13px}.activities{gap:5px}.activities button{font-size:14px}.actor{width:65%}.tray-message{font-size:14px}}
@media(min-width:720px) and (max-height:600px){.app{width:min(100%,1080px);min-height:390px;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);grid-template-rows:52px 1fr 86px 18px;gap:10px}.app header{grid-column:1/-1}.room{grid-column:1;grid-row:2/5;min-height:280px}.tool-tray{grid-column:2;grid-row:2;align-self:stretch}.activities{grid-column:2;grid-row:3}footer{grid-column:2;grid-row:4}.actor{width:45%;bottom:7%}.actor[data-location=platform]{width:33%;bottom:27%}.actor[data-location=bed]{width:32%}.speech{top:60px;font-size:14px}.choice{min-height:60px}.room-hint{padding:3px}.scene-button.bed{bottom:13%}}
.room{container-type:size}
.tool-tray,.choice{touch-action:none}
.actor{width:min(67%,54cqh)}
.actor[data-location=platform]{left:16%;bottom:52%;width:min(32%,32cqh)}
.actor[data-location=bed]{left:82%;bottom:23%;width:min(34%,35cqh)}
.actor[data-location=bed]:after{content:"";position:absolute;left:18%;bottom:0;width:76%;height:32%;border-radius:48% 40% 24% 24%;background:repeating-linear-gradient(45deg,#d3dbdf 0 12px,#e8edeb 12px 24px);border:3px solid #eef1eb;box-shadow:0 3px 5px #5a514a25;z-index:5;pointer-events:none}
.room[data-scene=room]{background:#edf2e3 url("room.png") center/100% 100% no-repeat}
.room[data-scene=platform]{background:radial-gradient(circle at 75% 18%,#fff9d7 0 6%,transparent 7%),linear-gradient(180deg,#d5efec 0 55%,#c69a6b 55% 58%,#a86f43 58% 100%)}
.room[data-scene=bath]{background:linear-gradient(90deg,#ffffff55 2px,transparent 2px) 0 0/54px 54px,linear-gradient(#ffffff55 2px,transparent 2px) 0 0/54px 54px,linear-gradient(155deg,#cdeff1,#9fd8df)}
.room[data-scene=bed]{background:radial-gradient(circle at 76% 18%,#fff4bd 0 6%,#fff4bd44 7%,transparent 19%),linear-gradient(160deg,#29436a,#17233f 62%,#4f3c55)}
.scene-decor{display:none;position:absolute;inset:0;z-index:1;pointer-events:none}.room[data-scene=platform] .platform-decor,.room[data-scene=bath] .bath-decor,.room[data-scene=bed] .bed-decor{display:block}
.perch-top{position:absolute;left:12%;right:12%;bottom:16%;height:22%;border-radius:50% 50% 20px 20px;background:linear-gradient(#c99767,#a9693f);border:6px solid #e2b17e;box-shadow:0 8px 0 #825035}.perch-post{position:absolute;bottom:0;width:14%;height:38%;border-radius:14px 14px 0 0;background:repeating-linear-gradient(90deg,#b2764d 0 7px,#c88d5c 7px 14px)}.perch-post.one{left:25%}.perch-post.two{right:25%}.perch-step{position:absolute;width:36%;height:11%;border-radius:50%;background:#d8a875;border:4px solid #ebc294;box-shadow:0 5px 0 #94603e}.perch-step.one{left:1%;bottom:51%}.perch-step.two{right:1%;bottom:69%}
.perch-target{display:none;position:absolute;z-index:8;width:68px;height:58px;border:3px solid #fff;background:#fff8d8dd;border-radius:50%;font-size:25px;box-shadow:0 4px 0 #8d603977;pointer-events:auto}.room[data-scene=platform] .perch-target{display:block}.perch-target.left{left:8%;bottom:52%}.perch-target.middle{left:42%;bottom:23%}.perch-target.right{right:8%;bottom:70%}.perch-target:active{transform:translateY(3px);box-shadow:0 1px 0 #8d603977}
.bath-mirror{position:absolute;right:8%;top:17%;width:25%;height:29%;border:7px solid #f6d7af;border-radius:50% 50% 44% 44%;background:linear-gradient(145deg,#f7ffff,#b5dce7)}.shower{position:absolute;left:8%;top:19%;font-size:54px;transform:rotate(-15deg)}.towel{position:absolute;right:6%;top:51%;width:25%;height:23%;border-radius:14px;background:repeating-linear-gradient(90deg,#ffe6a7 0 14px,#fff1c9 14px 28px);box-shadow:0 4px 0 #76aab055}.tub{position:absolute;left:7%;right:7%;bottom:3%;height:28%;border-radius:18px 18px 46px 46px;background:linear-gradient(#fff 0 16%,#d7f2f3 17% 75%,#b6dde1 76%);border:5px solid #f8ffff;box-shadow:0 8px 0 #6da5ae55}.duck{position:absolute;right:14%;bottom:25%;font-size:40px}
.moon{position:absolute;right:10%;top:16%;font-size:72px;color:#ffe9a0;text-shadow:0 0 24px #fff2b8}.stars{position:absolute;left:8%;right:8%;top:28%;font-size:23px;letter-spacing:5px;color:#fff6bf}.lamp{position:absolute;left:7%;bottom:26%;width:16%;height:31%;background:linear-gradient(90deg,transparent 42%,#ba9275 43% 57%,transparent 58%)}.lamp:before{content:"";position:absolute;left:-20%;top:0;width:140%;height:35%;background:#ffe5a8;clip-path:polygon(20% 0,80% 0,100% 100%,0 100%);filter:drop-shadow(0 0 12px #ffe7a0)}.rug{position:absolute;left:16%;right:13%;bottom:3%;height:22%;border-radius:50%;background:repeating-linear-gradient(45deg,#ab8cb1 0 18px,#c1a5c6 18px 36px);opacity:.9}
.room[data-scene=platform] .actor[data-location=platform]{left:52%;bottom:20%;width:min(56%,52cqh)}.room[data-scene=platform] .actor[data-location=platform][data-perch=left]{left:22%;bottom:49%;width:min(39%,39cqh)}.room[data-scene=platform] .actor[data-location=platform][data-perch=middle]{left:52%;bottom:20%;width:min(56%,52cqh)}.room[data-scene=platform] .actor[data-location=platform][data-perch=right]{left:78%;bottom:66%;width:min(34%,34cqh)}.room[data-scene=bed] .actor[data-location=bed]{left:68%;bottom:17%;width:min(48%,44cqh)}
.limbs{position:absolute;inset:0;z-index:4;pointer-events:none}.limb{position:absolute;display:block;background:linear-gradient(180deg,#e89d63 0 48%,#fff5e9 49% 100%);border-radius:48% 48% 55% 55%;box-shadow:inset 0 -3px 5px #d18e6555,0 2px 3px #6a3b2725;transform-origin:50% 10%}.forepaw{top:57%;width:14%;height:27%}.forepaw.left{left:27%;transform:rotate(8deg)}.forepaw.right{right:28%;transform:rotate(-8deg)}.hindpaw{top:78%;width:19%;height:14%;background:radial-gradient(circle at 50% 55%,#e8a5a3 0 13%,transparent 14%),linear-gradient(#fff8ef,#f7e9d7)}.hindpaw.left{left:22%;transform:rotate(-4deg)}.hindpaw.right{right:23%;transform:rotate(4deg)}
.actor[data-reaction=idle] .forepaw.left{animation:pawhello 3.4s ease-in-out infinite}.actor[data-reaction=idle] .forepaw.right{animation:pawhello 3.4s 1.7s ease-in-out infinite}.actor[data-reaction=headshake] .forepaw{animation:pawpat .7s ease-in-out 3}.actor[data-reaction=jump] .forepaw{animation:pawreach .42s ease-in-out 5}.actor[data-reaction=jump] .hindpaw{animation:hindkick .42s ease-in-out 5}.actor[data-reaction=chase] .forepaw.left{animation:runpaw .26s ease-in-out infinite alternate}.actor[data-reaction=chase] .forepaw.right{animation:runpaw .26s .13s ease-in-out infinite alternate-reverse}.actor[data-reaction=chase] .hindpaw.left{animation:hindkick .24s ease-in-out infinite alternate}.actor[data-reaction=chase] .hindpaw.right{animation:hindkick .24s .12s ease-in-out infinite alternate-reverse}.actor[data-reaction=brush] .forepaw,.actor[data-reaction=soap] .forepaw,.actor[data-reaction=rinse] .forepaw,.actor[data-reaction=dry] .forepaw{animation:pawpat .38s ease-in-out infinite alternate}
.room[data-scene=room] .actor[data-reaction=chase]{left:var(--chase-x,51%);bottom:var(--chase-y,13%);transition:left .24s ease-out,bottom .24s ease-out,width .3s}.actor[data-reaction=chase] .body-motion{animation:bodyrun .28s ease-in-out infinite alternate}.actor[data-reaction=chase] .tail-motion{animation:tailwag .28s ease-in-out infinite}
@keyframes pawhello{0%,88%,100%{transform:rotate(8deg)}94%{transform:translateY(-8%) rotate(-5deg)}}@keyframes pawpat{to{transform:translateY(-13%) rotate(12deg)}}@keyframes pawreach{50%{transform:translateY(-28%) scaleY(1.16)}}@keyframes hindkick{to{transform:translateY(16%) rotate(15deg)}}@keyframes runpaw{to{transform:translateY(-24%) rotate(17deg)}}@keyframes bodyrun{to{transform:translateY(-5%) rotate(2deg)}}
.actor[data-reaction=idle] .body-motion{animation:idleBreathe 3.8s ease-in-out infinite}.actor[data-reaction=idle] .head-motion{animation:idleHead 4.8s ease-in-out infinite}.actor[data-reaction=idle][data-micro=blink] .head{background-position:50% 0!important}.actor[data-reaction=idle][data-micro=ear] .head-motion{animation:earListen 1.15s ease-in-out 1}.actor[data-reaction=idle][data-micro=shift] .body-motion{animation:weightShift 1.35s ease-in-out 1}.actor[data-reaction=idle][data-micro=shift] .tail-motion{animation:tailBalance 1.35s ease-in-out 1}
.actor[data-reaction=headshake] .head-motion{animation:petLean .8s ease-in-out 3}.actor[data-reaction=belly] .body-motion{animation:bellyRoll .78s ease-in-out 3}.actor[data-reaction=paws] .forepaw{animation:pawRecoil .48s ease-in-out 4}.actor[data-reaction=paws] .head-motion{animation:curiousTilt 1s ease-in-out 2}
.actor[data-reaction=angry]{animation:angryStomp .34s ease-in-out 6}.actor[data-reaction=angry] .head-motion{animation:angryNo .42s ease-in-out 5}.actor[data-reaction=angry] .forepaw.left{animation:angryPaw .34s ease-in-out 6}.actor[data-reaction=angry] .head:before{content:"";position:absolute;inset:0;background:linear-gradient(20deg,transparent 44%,#75452f 45% 48%,transparent 49%) 20% 22%/25% 18% no-repeat,linear-gradient(-20deg,transparent 44%,#75452f 45% 48%,transparent 49%) 80% 22%/25% 18% no-repeat;z-index:2}
.actor[data-reaction=jump]{animation:jumpArc 1.05s cubic-bezier(.2,.75,.25,1)}.actor[data-reaction=jump] .forepaw{animation:jumpReach .52s ease-in-out 2}.actor[data-reaction=jump] .hindpaw{animation:jumpTuck .52s ease-in-out 2}.actor[data-reaction=jump] .tail-motion{animation:tailBalance .65s ease-in-out 2}
.actor[data-chase=crouch] .body-motion{animation:crouch .7s ease-in-out infinite alternate}.actor[data-chase=crouch] .hindpaw{animation:readyPaws .7s ease-in-out infinite alternate}
.actor[data-reaction=chase][data-chase=run] .body-motion{animation:naturalRun .34s ease-in-out infinite alternate}.actor[data-reaction=chase][data-chase=run] .forepaw.left{animation:runPawLeft .34s ease-in-out infinite alternate}.actor[data-reaction=chase][data-chase=run] .forepaw.right{animation:runPawRight .34s ease-in-out infinite alternate}.actor[data-reaction=chase][data-chase=run] .hindpaw.left{animation:runPawRight .34s ease-in-out infinite alternate}.actor[data-reaction=chase][data-chase=run] .hindpaw.right{animation:runPawLeft .34s ease-in-out infinite alternate}.actor[data-reaction=chase][data-chase=run] .tail-motion{animation:tailBalance .52s ease-in-out infinite alternate}
.actor[data-reaction=chase][data-chase=pounce]{animation:pounce .48s cubic-bezier(.2,.8,.3,1) infinite alternate}.actor[data-reaction=chase][data-chase=pounce] .forepaw{animation:pounceReach .48s ease-out infinite alternate}.actor[data-reaction=chase][data-chase=pounce] .hindpaw{animation:jumpTuck .48s ease-out infinite alternate}.actor[data-reaction=chase][data-chase=land] .body-motion{animation:softLand .62s ease-out 1}.actor[data-reaction=chase][data-chase=land] .forepaw{animation:landPaws .62s ease-out 1}
.actor[data-reaction=sleep] .body-motion{animation:sleepBreathe 3.6s ease-in-out infinite}.actor[data-reaction=sleep] .forepaw.left{animation:sleepKnead 2.2s ease-in-out infinite}.actor[data-reaction=sleep] .forepaw.right{animation:sleepKnead 2.2s 1.1s ease-in-out infinite}.actor[data-reaction=rinse] .head-motion,.actor[data-reaction=rinse] .body-motion{animation:wetShake .2s ease-in-out 8}.actor[data-reaction=dry] .head-motion,.actor[data-reaction=dry] .body-motion{animation:fluffUp .72s ease-in-out infinite alternate}
@keyframes idleBreathe{0%,100%{transform:translateY(0) scale(1)}50%{transform:translateY(-1.5%) scale(1.015)}}@keyframes idleHead{0%,100%{transform:rotate(var(--head-turn,0deg)) translateY(0)}48%{transform:rotate(var(--head-turn,0deg)) translateY(-1.2%)}}
@keyframes earListen{0%,100%{transform:rotate(0)}28%{transform:rotate(-4deg) translateY(-1%)}48%{transform:rotate(3deg)}68%{transform:rotate(-2deg)}}@keyframes weightShift{0%,100%{transform:translateX(0) rotate(0)}45%{transform:translateX(-3%) rotate(-2deg)}70%{transform:translateX(2%) rotate(1deg)}}@keyframes tailBalance{0%,100%{transform:rotate(-10deg)}50%{transform:rotate(15deg)}}
@keyframes petLean{0%,100%{transform:rotate(0) translateY(0)}45%,70%{transform:rotate(-6deg) translateY(2%)}}@keyframes bellyRoll{0%,100%{transform:rotate(0) scale(1)}45%{transform:rotate(-7deg) scale(.98,1.03)}70%{transform:rotate(5deg) scale(1.02,.98)}}@keyframes pawRecoil{0%,100%{transform:translateY(0)}50%{transform:translateY(-20%) scaleY(.9)}}@keyframes curiousTilt{0%,100%{transform:rotate(0)}50%{transform:rotate(7deg)}}@keyframes angryStomp{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-3%) rotate(-1deg)}}@keyframes angryNo{0%,100%{transform:rotate(0)}25%{transform:rotate(-7deg)}75%{transform:rotate(7deg)}}@keyframes angryPaw{0%,100%{transform:translateY(0)}55%{transform:translateY(12%) scaleY(.88)}}
@keyframes jumpArc{0%{transform:translateX(-50%) translateY(20%) scaleY(.9)}38%{transform:translateX(-50%) translateY(-24%) scaleY(1.03)}72%{transform:translateX(-50%) translateY(-6%)}100%{transform:translateX(-50%) translateY(0)}}@keyframes jumpReach{0%,100%{transform:translateY(0)}45%{transform:translateY(-32%) rotate(6deg)}}@keyframes jumpTuck{0%,100%{transform:translateY(0)}50%{transform:translateY(-22%) scaleY(.82)}}
.actor[data-exit=platform]{animation:jumpDown .7s ease-in 1!important}@keyframes jumpDown{0%{transform:translateX(-50%) translateY(0) scale(1)}45%{transform:translateX(-50%) translateY(-15%) scale(.96)}100%{transform:translateX(-50%) translateY(58%) scale(.82);opacity:.2}}
@keyframes crouch{to{transform:translateY(4%) scaleY(.96)}}@keyframes readyPaws{to{transform:translateY(11%) scaleY(.9)}}@keyframes naturalRun{to{transform:translateY(-4%) rotate(1.5deg)}}@keyframes runPawLeft{to{transform:translateY(-27%) rotate(14deg)}}@keyframes runPawRight{to{transform:translateY(10%) rotate(-11deg)}}@keyframes pounce{from{transform:translateX(-50%) translateY(2%) scale(.97)}to{transform:translateX(-50%) translateY(-13%) scale(1.04)}}@keyframes pounceReach{to{transform:translateY(-38%) scaleY(1.18)}}@keyframes softLand{0%{transform:translateY(-10%) scaleY(1.06)}55%{transform:translateY(4%) scaleY(.92)}100%{transform:translateY(0) scaleY(1)}}@keyframes landPaws{0%{transform:translateY(-25%)}60%{transform:translateY(8%)}100%{transform:translateY(0)}}
@keyframes sleepBreathe{0%,100%{transform:scale(1) translateY(0)}50%{transform:scale(1.025,.985) translateY(1%)}}@keyframes sleepKnead{0%,100%{transform:translateY(0) scaleY(1)}45%{transform:translateY(9%) scaleY(.9)}}@keyframes wetShake{0%,100%{transform:translateX(0) rotate(0)}25%{transform:translateX(-2%) rotate(-2deg)}75%{transform:translateX(2%) rotate(2deg)}}@keyframes fluffUp{from{transform:scale(.97)}to{transform:scale(1.035)}}
.scene-button.platform{top:54%}
@media(min-width:720px) and (max-height:600px){.actor{width:min(45%,54cqh)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}.spark{opacity:1}.actor[data-reaction=spin]{transform:translateX(-50%)}}
