/* Sprite positions: rows = 吉伊 / 小八 / 乌萨奇; columns = idle / pet / feed. */
.sprite{display:block;aspect-ratio:1;background-image:url('/static/assets/v2/sprites-aligned.webp');background-size:300% 300%;background-repeat:no-repeat;background-position:0 0;flex-shrink:0}.sprite.hachi{background-position:0 50%}.sprite.usagi{background-position:0 100%}.sprite.pose-pet{background-position-x:50%}.sprite.pose-feed{background-position-x:100%}.friend-trio{display:inline-flex;align-items:end;justify-content:center;isolation:isolate}.friend-trio .sprite{width:58px}.friend-trio .sprite+.sprite{margin-left:-5px}.friends-town{border-radius:27px 27px 18px 18px;background:#fff9e8;padding:9px;transform:rotate(.5deg);box-shadow:3px 5px 0 #ddd2b45e}.friends-town .town-scene{border-radius:19px 19px 7px 7px}.friends-town .town-note{font-size:10px;padding:5px 14px;top:-15px}.friends-town .town-label{background:#fffdf1f2;border:1.5px solid #a89569;border-radius:9px;box-shadow:2px 3px 0 #e0cfa363;padding:5px 12px;font-size:12px;color:#736345}.friends-town .town-label::after{border-color:#a89569}.friends-town .house{left:20%;top:35%}.friends-town .mail{left:48%;top:39%}.friends-town .tree{left:83%;top:32%}.town-residents{position:absolute;left:0;right:0;bottom:3%;height:44%;display:flex;align-items:end;justify-content:center;gap:2%;padding:0 5%;isolation:isolate}.town-character{width:29%;padding:0;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:end;color:#655940;min-width:0;border-radius:30%;touch-action:manipulation}.town-character:focus-visible{outline:3px dashed #ab8c54;outline-offset:2px}.resident-motion{position:relative;display:block;width:100%;transform-origin:center 86%}.town-character .sprite{width:100%;filter:drop-shadow(0 4px 0 #a4a36b20)}.resident-name{background:#fff7e3eb;color:#7d6b4b;border:1px solid #cabb9266;border-radius:99px;padding:0 10px;font-size:10px;line-height:1.8;position:absolute;bottom:-3%;letter-spacing:1px}.resident-reaction{position:absolute;bottom:101%;left:50%;transform:translate(-50%,5px);width:max-content;max-width:175px;text-align:center;z-index:5;background:#fffdf6;border:1.5px solid #cab897;border-radius:13px;padding:7px 11px;font-size:11px;line-height:1.6;opacity:0;pointer-events:none;box-shadow:2px 3px 0 #dfcda34a;transition:opacity .15s,transform .15s}.resident-reaction::after{content:'';position:absolute;width:7px;height:7px;background:#fffdf6;border-right:1.5px solid #cab897;border-bottom:1.5px solid #cab897;bottom:-5px;left:45%;transform:rotate(45deg)}.is-pet .resident-reaction,.is-feed .resident-reaction{opacity:1;transform:translate(-50%,0)}.resident-sparkles{position:absolute;left:7%;right:0;top:-5%;color:#d5a563;font-size:23px;letter-spacing:13px;opacity:0;pointer-events:none;white-space:nowrap}.is-pet .resident-sparkles,.is-feed .resident-sparkles{animation:friend-sparkles 1.2s ease-out 2}.town-character.chii.is-pet .resident-motion{animation:chii-pet 650ms ease-in-out 3}.town-character.hachi.is-pet .resident-motion{animation:hachi-pet 600ms ease-in-out 3}.town-character.usagi.is-pet .resident-motion{animation:usagi-pet 650ms ease-in-out 3}.town-character.chii.is-feed .resident-motion{animation:chii-feed 450ms ease-in-out 4}.town-character.hachi.is-feed .resident-motion{animation:hachi-feed 600ms ease-in-out 3}.town-character.usagi.is-feed .resident-motion{animation:usagi-feed 1700ms ease-in-out 1}.resident-toolbar{padding:12px 7px 5px;display:flex;align-items:center;justify-content:space-between;gap:10px}.resident-modes{display:flex;gap:7px;flex-shrink:0}.resident-modes button{display:flex;gap:6px;align-items:center;border:1px solid #dfd2b5;background:#fffcf5;border-radius:99px;min-height:39px;padding:6px 15px;color:#938465;font-size:12px}.resident-modes button[aria-pressed="true"]{border-color:#ac9c6b;background:#f3edca;color:#706039;box-shadow:1px 2px 0 #d3c8a04a}.resident-modes svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.resident-toolbar p{font-size:10px;color:#a2987f;text-align:right}.title-buddy{display:inline-block;width:50px;vertical-align:bottom;margin-left:8px;margin-top:-15px;transform:rotate(6deg);pointer-events:none}.title-buddy .sprite{width:100%}.page-heading h1{display:flex;align-items:center;gap:0}.empty-residents{margin:-5px auto 5px;display:flex;justify-content:center}.empty-residents .sprite{width:64px}.home-empty .empty-residents{margin-top:-10px}.empty-residents .sprite:nth-child(1){transform:rotate(-8deg)}.empty-residents .sprite:nth-child(3){transform:rotate(8deg)}.about-friends{display:flex;justify-content:center;margin-top:20px}.about-friends .sprite{width:75px}.login-art .town-scene{width:100%;border-radius:inherit;aspect-ratio:1.1}.login-art .town-image{aspect-ratio:auto;object-fit:cover}.login-art .town-residents{bottom:7%;height:40%;padding:0 2%}.login-art{background:#f8edce}.welcome-scene .town-character{width:32%}.login-form-area h1{font-size:31px}.hero h1{font-weight:600}.home-tagline{position:relative}.paper-together{display:flex;align-items:center;justify-content:center;gap:12px;font-size:11px;letter-spacing:1px;color:#a38a65;margin-top:30px}.paper-together .friend-trio .sprite{width:42px}#companion-response{position:fixed;z-index:30;bottom:34px;left:50%;transform:translate(-50%,15px);max-width:calc(100vw - 36px);width:max-content;display:flex;align-items:center;gap:7px;padding:2px 20px 2px 5px;border:1.5px solid #d0bc97;border-radius:16px;background:#fff9e8;box-shadow:2px 4px 0 #dcc4966e;color:#8c7452;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;font-size:12px}#companion-response.visible{opacity:1;transform:translate(-50%,0)}.response-friend{display:block;width:65px;flex-shrink:0}#companion-response .friend-trio .sprite{width:48px}#companion-response.visible .response-friend{animation:hachi-pet .8s ease-in-out 2}#companion-response.visible .friend-trio{animation:usagi-pet .7s ease-in-out 2}
@keyframes chii-pet{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-5px) rotate(-5deg) scale(1.035)}}@keyframes hachi-pet{0%,100%{transform:rotate(0)}25%{transform:rotate(-7deg)}75%{transform:rotate(7deg)}}@keyframes usagi-pet{0%,100%{transform:translateY(0) rotate(0)}40%{transform:translateY(-16px) rotate(7deg)}70%{transform:translateY(-3px) rotate(-5deg)}}@keyframes chii-feed{0%,100%{transform:scale(1)}50%{transform:scale(1.025,.975) translateY(2px)}}@keyframes hachi-feed{0%,100%{transform:rotate(0)}50%{transform:rotate(-5deg) translateY(-4px)}}@keyframes usagi-feed{0%,20%,40%{transform:rotate(0) scale(1)}10%,30%,50%{transform:rotate(-5deg) scale(1.04,.97)}65%{transform:rotate(0)}100%{transform:rotate(360deg)}}@keyframes friend-sparkles{0%{opacity:0;transform:translateY(10px) scale(.7)}45%{opacity:1}100%{opacity:0;transform:translateY(-17px) scale(1.1)}}
@media(max-width:850px){.resident-toolbar{display:block;text-align:center;padding-top:10px}.resident-modes{justify-content:center}.resident-toolbar p{text-align:center;margin-top:6px}.friends-town .town-label{font-size:10px;padding:3px 9px;min-height:31px}.resident-reaction{max-width:120px;font-size:10px}.resident-name{font-size:9px}}
@media(max-width:650px){.friends-town{padding:6px;border-radius:23px 23px 14px 14px;box-shadow:2px 4px 0 #ddd2b45e}.friends-town .town-scene{border-radius:17px 17px 6px 6px;aspect-ratio:1.4}.friends-town .town-note{font-size:8px;padding:4px 12px;top:-12px}.friends-town .town-label{font-size:9px;min-height:30px;padding:4px 7px;border-radius:7px}.friends-town .house{top:30%;left:20%}.friends-town .mail{top:35%;left:49%}.friends-town .tree{top:26%;left:82%}.town-residents{padding:0 3%;gap:1%;bottom:6%;height:45%}.town-character{width:31%}.resident-name{font-size:8px;bottom:-5%;padding:0 7px;line-height:1.7}.resident-reaction{font-size:10px;max-width:108px;padding:6px 8px;bottom:100%;line-height:1.55}.town-character.chii .resident-reaction{left:60%}.town-character.usagi .resident-reaction{left:40%}.resident-sparkles{font-size:16px;letter-spacing:8px}.resident-toolbar{padding:15px 5px 5px;display:flex}.resident-modes{gap:6px}.resident-modes button{min-height:38px;padding:7px 11px;gap:4px;font-size:11px}.resident-modes svg{width:16px;height:16px}.resident-toolbar p{font-size:8px;line-height:1.7;text-align:right;max-width:75px;margin:0}.title-buddy{width:43px;margin-left:7px;margin-top:-8px}.empty-residents .sprite{width:60px}.empty{padding:22px 20px}.home-empty{min-height:210px}.about-friends .sprite{width:65px}.login-art .town-scene{aspect-ratio:1.5}.login-art .town-residents{bottom:6%}.login-form-area h1{font-size:27px}.hero h1{font-size:29px}.hero-couple .avatar{border-color:#fff9eb}.paper-together{font-size:10px;gap:5px;margin-top:25px}.paper-together .friend-trio .sprite{width:36px}#companion-response{bottom:100px;font-size:11px;padding:3px 13px 3px 2px;gap:2px;max-width:calc(100vw - 28px)}#companion-response .response-friend{width:57px}#companion-response .friend-trio .sprite{width:37px}}
@media(prefers-reduced-motion:reduce){.resident-motion,.resident-sparkles,.response-friend,.friend-trio{animation:none!important}.is-pet .resident-sparkles,.is-feed .resident-sparkles{opacity:1;transform:none}.resident-reaction,#companion-response{transition:none}}

.resident-reaction:empty{display:none}

.card-peek{position:absolute;right:66px;top:-23px;width:63px;height:32px;overflow:hidden;pointer-events:none;z-index:1}.card-peek .sprite{width:63px;transform:translateY(-9px)}.card-peek .sprite.usagi{transform:translateY(0)}.letter-card .card-peek{right:72px;top:-20px}.wishes-grid{row-gap:24px}@media(max-width:650px){.card-peek{width:55px;height:29px;right:56px;top:-20px}.card-peek .sprite{width:55px;transform:translateY(-8px)}.card-peek .sprite.usagi{transform:translateY(0)}.letter-card .card-peek{right:63px;top:-18px}}

/* Action buttons immediately address the resident selected on the stage. */
.town-character.is-selected .resident-name{background:#fff4cd;border-color:#a99565;font-weight:600;box-shadow:0 2px 0 #c8b88145}.resident-target{letter-spacing:.2px}@media(max-width:650px){.resident-toolbar{display:block}.resident-modes{justify-content:center}.resident-toolbar p{max-width:none;text-align:center;font-size:10px;margin-top:6px}}