:root {
    --goose-bottom-offset: 92px;
    --goose-size: 132px;
}

.goose-mascot {
    position: fixed;
    left: 0;
    bottom: calc(var(--goose-bottom-offset) + env(safe-area-inset-bottom, 0px));
    width: var(--goose-size);
    height: var(--goose-size);
    z-index: 900;
    pointer-events: auto;
    touch-action: none;
    cursor: grab;
    user-select: none;
    transform: translate3d(0, 0, 0);
    will-change: transform;
}

.goose-actor {
    width: 100%;
    height: 100%;
    transform-origin: 50% 100%;
    will-change: transform;
}

.goose-mascot.is-dragging { cursor: grabbing; }
.goose-mascot.is-dragging .goose-actor { animation: goose-drag-protest 240ms steps(2, end) infinite; }
.goose-mascot.is-returning-safe { transition: transform 680ms cubic-bezier(.2,.8,.25,1); }
.goose-speech { pointer-events: none; }

.goose-svg {
    display: none;
    width: 100%;
    height: 100%;
    overflow: visible;
}

.goose-mascot[data-pet="goose"] [data-pet-svg="goose"],
.goose-mascot[data-pet="snake"] [data-pet-svg="snake"],
.goose-mascot[data-pet="mouse"] [data-pet-svg="mouse"] { display: block; }

[data-pet-svg="mouse"] .pet-primary { fill: var(--goose-user-color, #ffffff); }
[data-pet-svg="snake"] .pet-primary { stroke: var(--goose-user-color, #dff5df); }

#goose-grey-part {
    opacity: 0.32;
}

#goose-body > path,
#goose-head .goose-eye-white {
    fill: var(--goose-user-color, #ffffff);
}

.goose-mascot.is-facing-left .goose-svg {
    transform: scaleX(-1);
    transform-origin: center;
}

.goose-mascot.is-facing-left .goose-speech {
    transform: none;
}

.goose-speech {
    position: absolute;
    right: calc(72% + 8px);
    bottom: 82%;
    width: max-content;
    min-width: 112px;
    max-width: min(240px, calc(100vw - 32px));
    padding: 10px 13px 11px;
    border: 1px solid rgba(148, 163, 184, 0.24);
    border-radius: 13px;
    background: rgba(23, 28, 36, 0.96);
    color: #f5f7fb;
    font: 650 13px/1.38 -apple-system, BlinkMacSystemFont, "Inter", sans-serif;
    text-align: left;
    overflow-wrap: anywhere;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28), 0 2px 8px rgba(0, 0, 0, 0.18);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    opacity: 0;
    translate: 0 6px;
    transition: opacity 160ms ease, translate 200ms cubic-bezier(.2,.8,.2,1);
}

.goose-speech::after {
    position: absolute;
    right: -6px;
    bottom: 13px;
    width: 11px;
    height: 11px;
    border-top: 1px solid rgba(148, 163, 184, 0.24);
    border-right: 1px solid rgba(148, 163, 184, 0.24);
    background: rgba(23, 28, 36, 0.96);
    content: "";
    transform: rotate(45deg);
}

.goose-mascot.speech-on-right .goose-speech {
    right: auto;
    left: calc(72% + 8px);
}

.goose-mascot.speech-on-right .goose-speech::after {
    right: auto;
    left: -6px;
    border: 0;
    border-bottom: 1px solid rgba(148, 163, 184, 0.24);
    border-left: 1px solid rgba(148, 163, 184, 0.24);
}

.goose-speech.is-visible { opacity: 1; translate: 0 0; }
.goose-mascot.is-idle .goose-actor { animation: goose-idle 2.8s ease-in-out infinite; }
.goose-mascot.is-walking .goose-actor { animation: goose-body-walk 620ms steps(4, end) infinite; }
.goose-mascot.is-walking .goose-leg-front { animation: goose-front-leg-walk 620ms steps(4, end) infinite; }
.goose-mascot.is-walking .goose-leg-back { animation: goose-back-leg-walk 620ms steps(4, end) infinite; }
.goose-mascot.is-walking #goose-grey-part { transform-origin: 70px 108px; animation: goose-grey-walk 620ms steps(4, end) infinite; }
.goose-mascot.is-running .goose-actor { animation: goose-body-walk 310ms steps(4, end) infinite; }
.goose-mascot.is-running .goose-leg-front { animation: goose-front-leg-walk 310ms steps(4, end) infinite; }
.goose-mascot.is-running .goose-leg-back { animation: goose-back-leg-walk 310ms steps(4, end) infinite; }
.goose-mascot[data-pet="snake"].is-walking .goose-actor{animation:snake-travel 760ms ease-in-out infinite}
.goose-mascot[data-pet="snake"].is-running .goose-actor{animation:snake-travel 390ms ease-in-out infinite}
.goose-mascot[data-pet="snake"] #snake-head{transform-box:fill-box;transform-origin:20% 60%;will-change:transform}
.goose-mascot[data-pet="mouse"].is-walking .goose-actor{animation:mouse-scurry 360ms ease-in-out infinite}
.goose-mascot[data-pet="mouse"].is-running .goose-actor{animation:mouse-scurry 180ms ease-in-out infinite}
.goose-mascot[data-pet="mouse"].is-walking .mouse-leg-a{animation:mouse-paws-a 360ms ease-in-out infinite}
.goose-mascot[data-pet="mouse"].is-walking .mouse-leg-b{animation:mouse-paws-b 360ms ease-in-out infinite}
.goose-mascot[data-pet="mouse"].is-running .mouse-leg-a{animation:mouse-paws-a 180ms ease-in-out infinite}
.goose-mascot[data-pet="mouse"].is-running .mouse-leg-b{animation:mouse-paws-b 180ms ease-in-out infinite}
.goose-mascot[data-pet="mouse"].is-walking #mouse-tail{transform-box:fill-box;transform-origin:90% 50%;animation:mouse-tail-run 360ms ease-in-out infinite}
.goose-mascot[data-pet="mouse"].is-running #mouse-tail{transform-box:fill-box;transform-origin:90% 50%;animation:mouse-tail-run 180ms ease-in-out infinite}
.goose-mascot.is-running #goose-grey-part { transform-origin: 70px 108px; animation: goose-grey-walk 310ms steps(4, end) infinite; }
.goose-mascot.is-blinking .goose-pupil { animation: goose-blink 180ms ease-in-out 1; transform-box: fill-box; transform-origin: center; }
.goose-mascot.is-sighing .goose-actor { animation: goose-sigh 1.15s ease-in-out 1; }
.goose-mascot.is-sighing #goose-head { transform-box: fill-box; transform-origin: 25% 85%; animation: goose-head-sigh 1.15s ease-in-out 1; }
.goose-mascot.is-shaking #goose-head { transform-box: fill-box; transform-origin: 25% 80%; animation: goose-head-shake 700ms ease-in-out 1; }
.goose-mascot.is-looking-up #goose-head { transform-box: fill-box; transform-origin: 25% 80%; animation: goose-look-up 1.7s ease-in-out 1; }
.goose-mascot.is-looking-up .goose-pupil { transform: translateY(-3px); }
.goose-mascot.is-alert .goose-actor { animation: goose-alert 430ms ease-in-out 2; }

@keyframes goose-idle { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-2px) rotate(-0.7deg); } }
@keyframes goose-body-walk { 0% { transform: translateY(0) rotate(-1deg); } 25% { transform: translateY(-4px) rotate(1deg); } 50% { transform: translateY(0) rotate(-1deg); } 75% { transform: translateY(-3px) rotate(1deg); } 100% { transform: translateY(0) rotate(-1deg); } }
@keyframes goose-front-leg-walk { 0%, 100% { transform: translateX(-4px) rotate(10deg); } 50% { transform: translateX(6px) rotate(-14deg); } }
@keyframes goose-back-leg-walk { 0%, 100% { transform: translateX(6px) rotate(-14deg); } 50% { transform: translateX(-4px) rotate(10deg); } }
@keyframes goose-grey-walk { 0%, 100% { transform: rotate(0deg); } 50% { transform: rotate(-2deg); } }
@keyframes goose-blink { 0%, 100% { transform: scaleY(1); } 50% { transform: scaleY(0.08); } }
@keyframes goose-sigh { 0%, 100% { transform: translateY(0) scaleY(1); } 45%, 70% { transform: translateY(7px) scaleY(0.97); } }
@keyframes goose-head-sigh { 0%, 100% { transform: rotate(0deg) translateY(0); } 45%, 70% { transform: rotate(6deg) translateY(4px); } }
@keyframes goose-head-shake { 0%, 100% { transform: rotate(0); } 20% { transform: rotate(-8deg); } 40% { transform: rotate(8deg); } 60% { transform: rotate(-6deg); } 80% { transform: rotate(5deg); } }
@keyframes goose-look-up { 0%, 100% { transform: rotate(0deg); } 25%, 75% { transform: rotate(-8deg) translateY(-2px); } }
@keyframes goose-alert { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-9px) rotate(-2deg); } }
@keyframes snake-travel{0%,100%{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-3px) rotate(1deg)}}
@keyframes mouse-scurry{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px) scaleX(1.015)}}
@keyframes mouse-paws-a{0%,100%{transform:translate(-2px,0)}50%{transform:translate(2px,-2px)}}
@keyframes mouse-paws-b{0%,100%{transform:translate(2px,-2px)}50%{transform:translate(-2px,0)}}
@keyframes mouse-tail-run{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(5deg)}}
@keyframes goose-drag-protest { 0%, 100% { transform: rotate(-7deg) translateY(-2px); } 50% { transform: rotate(8deg) translateY(2px); } }

.goose-stolen-number {
    position: fixed;
    z-index: 899;
    white-space: nowrap;
    pointer-events: none;
    transition: transform 720ms cubic-bezier(.2, .8, .25, 1), opacity 180ms ease;
    will-change: transform;
}

.goose-carried-number {
    position: absolute;
    left: 8%;
    top: 54%;
    max-width: 96px;
    overflow: hidden;
    color: inherit;
    text-overflow: ellipsis;
    transform: scale(.78) rotate(-7deg);
    transform-origin: left center;
    transition: none;
}
.goose-stolen-number.is-returning { transition-duration: 680ms; }
.goose-number-missing { visibility: hidden !important; opacity: 0 !important; }

/* Шкодничество питомца: все эффекты кратковременны и сами откатываются. */
.pet-tile-pushed {
    animation: pet-tile-push 2.55s cubic-bezier(.2,.8,.2,1) both !important;
    will-change: transform;
}

body.pet-screen-shove-left main { animation: pet-screen-shove-left 920ms cubic-bezier(.2,.8,.25,1); }
body.pet-screen-shove-right main { animation: pet-screen-shove-right 920ms cubic-bezier(.2,.8,.25,1); }
body.pet-screen-hit main { animation: pet-screen-hit 480ms steps(3,end); }

.pet-screen-bonk {
    position: fixed;
    z-index: 898;
    color: #f59e0b;
    font: 900 20px/1 -apple-system, BlinkMacSystemFont, "Inter", sans-serif;
    letter-spacing: .04em;
    pointer-events: none;
    animation: pet-bonk-mark 1.2s ease-out both;
}

.pet-found-object {
    position: fixed;
    z-index: 898;
    min-width: 30px;
    padding: 5px 7px;
    border: 2px solid #24272d;
    border-radius: 5px;
    background: #fff7d6;
    color: #24272d;
    font: 800 9px/1 -apple-system, BlinkMacSystemFont, "Inter", sans-serif;
    text-align: center;
    opacity: 0;
    transform: translateY(14px) rotate(-12deg) scale(.75);
    transition: opacity 180ms ease, transform 420ms cubic-bezier(.2,.9,.3,1.3);
    pointer-events: none;
}
.pet-found-object.is-visible { opacity: 1; transform: translateY(0) rotate(6deg) scale(1); }
.goose-mascot.pet-peek-right { animation: pet-peek-right 3s ease-in-out both; }
.goose-mascot.pet-peek-left { animation: pet-peek-left 3s ease-in-out both; }

@keyframes pet-tile-push {
    0%,100% { transform: translate3d(0,0,0) rotate(0); }
    12%,72% { transform: translate3d(var(--pet-push-x),var(--pet-push-y),0) rotate(var(--pet-push-r)); }
    82% { transform: translate3d(2px,0,0) rotate(0); }
}
@keyframes pet-screen-shove-left { 0%,100%{transform:translateX(0)} 18%,64%{transform:translateX(-18px)} 78%{transform:translateX(4px)} }
@keyframes pet-screen-shove-right { 0%,100%{transform:translateX(0)} 18%,64%{transform:translateX(18px)} 78%{transform:translateX(-4px)} }
@keyframes pet-screen-hit { 0%,100%{transform:translate(0)} 25%{transform:translate(-3px,2px)} 50%{transform:translate(3px,-2px)} 75%{transform:translate(-2px,-1px)} }
@keyframes pet-bonk-mark { 0%{opacity:0;transform:scale(.4) rotate(-12deg)} 18%{opacity:1;transform:scale(1.18) rotate(5deg)} 70%{opacity:1} 100%{opacity:0;transform:translateY(-18px) scale(.9)} }
@keyframes pet-peek-right { 0%,100%{margin-left:0} 28%,72%{margin-left:calc(var(--goose-size) * .62)} }
@keyframes pet-peek-left { 0%,100%{margin-left:0} 28%,72%{margin-left:calc(var(--goose-size) * -.62)} }

@media (max-width: 767px) {
    :root { --goose-size: 48px; --goose-bottom-offset: 82px; }
    .goose-speech {
        bottom: 88%;
        min-width: 108px;
        max-width: min(196px, calc(100vw - 28px));
        padding: 9px 11px 10px;
        border-radius: 12px;
        font-size: 12px;
        line-height: 1.4;
    }
}

@media (min-width: 768px) and (max-width: 1366px) {
    :root { --goose-size: 62px; --goose-bottom-offset: 90px; }
    body.tablet-mode { --goose-bottom-offset: calc(var(--tablet-nav-height, 92px) + 16px); }
}

@media (min-width: 1367px) {
    :root { --goose-size: 74px; --goose-bottom-offset: 24px; }
}

@media (prefers-reduced-motion: reduce) {
    .goose-actor, .goose-leg, #goose-grey-part, #goose-head, .goose-pupil { animation: none !important; transition: none !important; }
}

@media (max-width: 767px) {
    body.manager-mode { --goose-bottom-offset: calc(var(--pwa-bottom-nav-height, 72px) + 16px); }
}
