/* Animal friends (ZEB-600): the 🐾 button under the map and the friends book. */
.animals-button{position:fixed;z-index:1;right:16px;top:calc(var(--hud-top,78px) + 236px);min-width:64px;height:64px;padding:0 10px;display:flex;align-items:center;justify-content:center;gap:2px;font-size:30px;line-height:1;cursor:pointer;color:#302f29}
.animals-button .animals-held:empty{display:none}
.animals-button .animals-held{font-size:26px}
#animals-book{width:min(560px,calc(100vw - 24px));max-height:calc(100dvh - 48px);overflow:auto;border:2px dashed #b7a78c;border-radius:24px;padding:16px 18px;background:#fff9ed;color:#302f29;font:17px system-ui}
#animals-book::backdrop{background:#24352866}
.animals-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.animals-head h2{margin:0;font-size:22px}
.animals-close{min-width:64px;min-height:64px;font-size:26px;border-radius:16px}
.animals-empty{font-size:34px;text-align:center;margin:12px 0;letter-spacing:2px}
.animals-pets{display:grid;gap:10px;margin:12px 0}
.animals-pet{display:grid;grid-template-columns:72px 1fr auto;grid-template-areas:"pic name bye" "pic where bye" "ribbons ribbons ribbons";align-items:center;gap:4px 10px;padding:8px;border:2px solid #e3d5bc;border-radius:16px;background:#fffdf6}
.animals-pet img{grid-area:pic;width:72px;height:72px}
.animals-pet b{grid-area:name;font-size:19px}
.animals-where{grid-area:where;font-size:22px}
.animals-bye{grid-area:bye;min-width:64px;min-height:64px;font-size:26px;border-radius:16px}
.animals-ribbons{grid-area:ribbons;display:flex;flex-wrap:wrap;gap:6px}
.animals-ribbon{min-width:48px;min-height:48px;font-size:22px;border-radius:14px;border:3px solid transparent;background:color-mix(in srgb,var(--ribbon) 30%,#fff)}
.animals-ribbon[aria-pressed=true]{border-color:var(--ribbon);box-shadow:0 0 0 3px #302f29}
.animals-met{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.animals-species{display:flex;flex-direction:column;align-items:center;padding:6px;border-radius:14px;background:#f6eedd;font-size:15px}
.animals-species img{width:72px;height:72px}
.animals-species.unmet img{filter:brightness(0) opacity(.28)}
body.whistle-playing .animals-button{display:none}
/* The build stamp moves down to make room under the map. */
body .meta{top:calc(var(--hud-top,78px) + 310px)}
@media(max-width:700px){.animals-button{right:8px;top:calc(var(--hud-top,112px) + 236px)}body .meta{top:auto}}
@media(max-width:340px){.animals-button{top:calc(var(--hud-top,112px) + 220px)}}
.animals-pouch{font-size:24px;margin:8px 0 0;letter-spacing:1px}
.animals-name{grid-area:name;min-height:44px;min-width:0;width:100%;box-sizing:border-box;font:700 19px system-ui;color:#302f29;background:#fff;border:2px solid #e3d5bc;border-radius:12px;padding:4px 10px}
.animals-name:focus-visible{outline:3px solid #c4562e;outline-offset:1px}
.animals-hearts{font-size:12px;letter-spacing:-1px}