:root{font-family:ui-rounded,'PingFang SC','Microsoft Yahei',sans-serif;color:#574c3e;background:#e9e5da}
*{box-sizing:border-box}body{margin:0}button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}button:focus-visible{outline:3px solid #728e68;outline-offset:3px}[hidden]{display:none!important}
.phone{max-width:480px;margin:auto;height:auto;min-height:100vh;min-height:100svh;background:#f7f1e5;display:flex;flex-direction:column;padding:calc(14px + env(safe-area-inset-top)) 20px calc(8px + env(safe-area-inset-bottom));overflow:visible}
header{display:flex;align-items:center;justify-content:space-between;flex:none}small{font-size:10px;letter-spacing:2px;color:#9b8c74}h1{font-size:24px;letter-spacing:2px;margin:5px 0 15px;font-weight:600}
#sound{background:#fff9ed;border:1px solid #dfd4bd;border-radius:22px;min-height:44px;padding:8px 14px;font-size:12px}
.needs{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;flex:none;margin-bottom:10px}.need{padding:9px;border:1px solid #e7ddc9;border-radius:14px;background:#fffbf3;font-size:11px}.need img{width:26px;height:26px;object-fit:contain;vertical-align:middle;margin-right:3px}.need span{float:right;padding-top:7px;font-size:10px;color:#8a806d}.need progress{width:100%;height:6px;accent-color:#8da17a;display:block;margin-top:6px}
.room{position:relative;flex:1;min-height:260px;border-radius:28px;background:linear-gradient(#f2e9d7,#e8dcc2);overflow:hidden;border:1px solid #e0d2b6}
.hello{position:absolute;top:14px;width:100%;text-align:center;z-index:4;font-size:11px;color:#96866f;pointer-events:none}.hello small{display:block;font-size:10px;margin-top:6px;letter-spacing:0}
.scene-prop{position:absolute;border:0;background:none;padding:0;overflow:visible;pointer-events:none}.scene-prop img{position:absolute;object-fit:contain;display:block;pointer-events:none}
.window{left:38%;top:12%;width:58%;aspect-ratio:137/84;z-index:1}.sunbeam{position:absolute;left:38%;top:30%;width:60%;height:50%;background:linear-gradient(125deg,#fff8cd00,#fff4cb44,#fff4cb00);transform:skewX(-15deg);pointer-events:none;z-index:1}
.floor{position:absolute;top:55%;bottom:0;width:100%;background:repeating-linear-gradient(0deg,#ccb18722 0 1px,transparent 1px 42px),#d6bf99;border-top:4px solid #c5ae87}
.cat-tree{left:5%;bottom:31%;width:32%;aspect-ratio:74/101;z-index:2}.bed{right:4%;bottom:27%;width:48%;aspect-ratio:128/70;z-index:2;pointer-events:auto;min-height:44px}.rug{left:12%;bottom:10%;width:76%;aspect-ratio:118/63;z-index:2}
#cat{position:absolute;width:min(56%,215px);aspect-ratio:1;left:50%;bottom:18%;transform:translateX(-50%);border:0;background:transparent;padding:0;z-index:3;touch-action:none;user-select:none;-webkit-user-select:none}
#sprite,#sprite-previous,#cat-life{width:100%;height:100%;object-fit:contain;pointer-events:none;transform-origin:50% 100%}#sprite{position:relative;will-change:transform}#sprite-previous,#cat-life{position:absolute;inset:0}#sprite-previous{opacity:0;z-index:2}#cat-life{z-index:1}.pose-out{animation:poseOut .2s ease-out both}.pose-in{animation:poseIn .2s ease-out both;z-index:3}@keyframes poseOut{from{opacity:1}to{opacity:0}}@keyframes poseIn{from{opacity:0}to{opacity:1}}
#effect{position:absolute;pointer-events:none;z-index:5;width:36px;top:42%;left:58%;animation:float 1.5s ease-out both}#ball{position:absolute;width:52px;height:52px;left:43%;bottom:15%;z-index:5;background:none;border:0;padding:0;will-change:transform;touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab}#ball img{width:100%;height:100%;object-fit:contain}
#status{position:absolute;z-index:6;bottom:5px;left:8px;right:8px;text-align:center;font-size:11px;color:#67563e;min-height:18px;background:#f8f1ddc9;border-radius:12px;padding:7px 5px}
nav{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding-top:14px;flex:none}nav button{border:1px solid #ded3bc;background:#fffaf0;border-radius:22px;min-height:82px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2px;font-size:13px}nav button img{width:43px;height:43px;object-fit:contain}nav button:active{transform:scale(.96)}nav button[aria-pressed=true]{background:#e3e9d4;border-color:#a5b48a}nav button[data-queued=true]{border-color:#a5b48a;box-shadow:inset 0 0 0 1px #a5b48a}nav button:disabled{opacity:.55}
footer{font-size:10px;color:#a2937c;text-align:center;padding-top:10px;flex:none;min-height:23px}@keyframes float{from{transform:translateY(8px);opacity:0}35%{opacity:1}to{transform:translateY(-20px);opacity:0}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important}}
@media(min-width:600px){.phone{height:auto;min-height:min(880px,100vh);min-height:min(880px,100svh);box-shadow:0 12px 60px #6b5b3b18}}
@media(max-height:650px){.phone{padding-top:calc(8px + env(safe-area-inset-top))}h1{font-size:20px;margin-bottom:7px}.need{padding:5px}.hello{top:9px}.hello small{margin-top:3px}.window{top:10%;width:52%;left:43%}nav{padding-top:8px}nav button{min-height:66px}}

#ball[data-dragging=true]{cursor:grabbing}#ball[data-dragging=true] img{filter:drop-shadow(0 3px 3px #886e3540)}
#cat{isolation:isolate;line-height:0}#sprite,#sprite-previous,#cat-life{display:block}#sprite,#sprite-previous{mix-blend-mode:plus-lighter}
@supports not (mix-blend-mode:plus-lighter){#sprite-previous{visibility:hidden}#sprite{opacity:1!important}}

#sprite,#sprite-previous,#cat-life{z-index:2}
#feed-bowl,#feed-bowl-front{position:absolute;object-fit:contain;pointer-events:none;transform:none;transition:none}
#feed-bowl{z-index:0}#feed-bowl-front{z-index:4}
@supports not (clip-path:inset(0)){#feed-bowl{clip-path:none!important}#feed-bowl-front{display:none!important}}

#cat-mouth{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;z-index:3;mix-blend-mode:normal}

#water-bowl,#water-bowl-front{position:absolute;object-fit:contain;pointer-events:none;transform:none;transition:none}#water-bowl{z-index:0}#water-bowl-front{z-index:4}#water-ripple{position:absolute;pointer-events:none;z-index:1;width:20%;height:3.5%;left:108%;top:88.4%;border-radius:50%;overflow:hidden}#water-ripple::after{content:'';position:absolute;inset:8% 12%;border:1px solid rgba(235,250,255,.65);border-radius:50%;animation:waterRipple .69s ease-out infinite}.is-paused #water-ripple::after{animation-play-state:paused}@keyframes waterRipple{from{transform:scale(.45);opacity:.8}to{transform:scale(1.15);opacity:0}}@media(prefers-reduced-motion:reduce){#water-ripple{display:none}}@supports not (clip-path:inset(0)){#water-bowl{clip-path:none!important}#water-bowl-front{display:none!important}}

.phone header{gap:12px}.phone header>div{min-width:0}.phone header #sound{flex:none}
.needs{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.need{min-width:0;display:grid;grid-template-columns:26px minmax(0,1fr);column-gap:4px;align-items:center}.need img{grid-column:1;grid-row:1/3;margin:0}.need span{grid-column:2;grid-row:2;float:none;padding:0;font-variant-numeric:tabular-nums;line-height:1.35}.need progress{grid-column:1/-1;grid-row:3;min-width:0}
nav button{min-width:0;padding:8px 5px;transition:background-color .16s,border-color .16s,box-shadow .16s}nav button span{max-width:100%;line-height:1.4;text-align:center;overflow-wrap:anywhere}nav button[data-queued=true]{border-style:dashed}nav button:disabled{opacity:.72;cursor:default}nav button[aria-pressed=true]:disabled{opacity:1}
.phone[aria-busy=true] button{cursor:wait}.phone[aria-busy=true] #cat{cursor:wait}#sound:disabled{opacity:.72}
#load-retry{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:8;min-height:44px;padding:11px 18px;border:1px solid #ded3bc;border-radius:16px;background:#fffaf0;font-size:13px;line-height:1.4;white-space:nowrap;box-shadow:0 3px 16px #6b5b3b18}
@media(prefers-reduced-motion:reduce){nav button{transition:none}nav button:active{transform:none}}