#curious-wren{position:fixed;left:0;top:0;width:0;height:0;pointer-events:none;z-index:9;will-change:transform}
#curious-wren[hidden],#wren-toggle[hidden]{display:none!important}
.wren-body{position:absolute;width:112px;height:112px;left:-56px;top:-56px;transform-origin:50% 52%;will-change:transform;filter:drop-shadow(0 3px 3px #071b2828)}
.wren-sprite{position:absolute;inset:0;background:url('wren-sprites.webp') 0 0/300% 200% no-repeat;opacity:1;transform-origin:50% 52%}
/* Flight cells 4 and 8 contain neighbouring feather tips before x=40.
   The actual beak starts beyond x=74; crop at x=54 of the 384px cell.
   Clip in sprite coordinates so the safe edge mirrors with its facing. */
.wren-sprite[data-sheet="flaps"]{clip-path:inset(0 0 0 14.0625%)}
#curious-wren.wren-resting,#curious-wren.wren-perching{z-index:12}
.wren-resting .wren-body{transform-origin:50% 83%;animation:wren-breathe 4.8s ease-in-out infinite!important}
@keyframes wren-breathe{0%,100%{transform:scale(1,1)}50%{transform:scale(1.012,1.025)}}
.wren-toggle{position:fixed;left:14px;bottom:14px;z-index:11;border:1px solid #b6c9ce55;border-radius:20px;background:#0a2232dc;color:#f9f3df;display:flex;align-items:center;gap:4px;padding:4px 10px 4px 4px;cursor:pointer;font:10px/1.3 Arial,Helvetica,sans-serif;box-shadow:0 2px 8px #02132122}
.wren-toggle-icon{width:30px;height:30px;background:url('wren-sprites.webp') 0 100%/300% 200% no-repeat}
.wren-toggle:focus-visible{outline:3px solid #e7b86e;outline-offset:4px}
@media(max-width:600px){.wren-body{width:96px;height:96px;left:-48px;top:-48px}.wren-toggle{left:8px;bottom:12px;font-size:9px;gap:2px;padding-right:8px}.wren-toggle-icon{width:24px;height:24px}}
@media print{#curious-wren,.wren-toggle{display:none!important}}