/* Иша — маскот: ходит по нижнему краю страницы, показывает состояние работы. Ничего не перекрывает: кликается только сама. */
.isha{position:fixed;left:0;bottom:calc(6px + env(safe-area-inset-bottom,0px));z-index:60;pointer-events:none;transform:translateX(var(--x,24px));
  transition:transform var(--t,0s) linear;will-change:transform}
.isha-in{position:relative;width:max-content;min-width:56px;pointer-events:auto;cursor:pointer;transform:translateY(calc(-1 * var(--y,0px))) rotate(var(--tilt,0deg));transform-origin:50% 100%;
  transition:transform .5s cubic-bezier(.3,1.5,.5,1)}
.isha-in::before{content:"";position:absolute;left:14%;right:14%;bottom:-3px;height:9px;border-radius:50%;background:rgba(0,0,0,.22);filter:blur(3px);z-index:-1;transition:opacity .3s,scale .3s}
.isha.walk .isha-in::before{animation:isha-shadow .38s ease-in-out infinite}
.isha.peek-l .isha-in{--tilt:24deg;transform:translate(-46%,10%) rotate(24deg)}
.isha.peek-r .isha-in{transform:translate(46%,10%) rotate(-24deg)}
.isha.peek-l .isha-in::before,.isha.peek-r .isha-in::before{opacity:0}
.isha img{display:block;height:128px;width:auto;filter:drop-shadow(0 6px 8px rgba(0,0,0,.28));transform:scaleX(var(--dir,1));user-select:none;-webkit-user-drag:none}
.isha.walk img{animation:isha-step .42s cubic-bezier(.4,0,.6,1) infinite;transform-origin:50% 100%}
.isha.run img{animation:isha-run .25s cubic-bezier(.4,0,.6,1) infinite}
.isha.land img{animation:isha-land .42s ease-out 1}
.isha.joy img{animation:isha-joy .8s ease-out 1}
.isha.shake img{animation:isha-shake .7s ease-in-out 1}
.isha.nod img{animation:isha-nod .7s ease-in-out 1}
.isha.idle img{animation:isha-breathe 3.2s ease-in-out infinite}
/* шаг: приседает, отталкивается, вытягивается в воздухе, наклон по ходу движения */
@keyframes isha-step{0%,100%{translate:0 0}50%{translate:0 -1.5px}}
@keyframes isha-run{0%,100%{translate:0 0;rotate:calc(var(--dir,1) * 5deg)}50%{translate:0 -3px;rotate:calc(var(--dir,1) * 6deg)}}
@keyframes isha-land{0%{scale:1.14 .84}45%{scale:.95 1.07}75%{scale:1.03 .98}100%{scale:1 1}}
@keyframes isha-joy{0%,100%{translate:0 0;scale:1 1}20%{scale:1.1 .88}45%{translate:0 -26px;scale:.94 1.08;rotate:-6deg}60%{translate:0 -26px;rotate:6deg}80%{translate:0 0;scale:1.08 .92}}
@keyframes isha-shake{0%,100%{rotate:0deg}15%{rotate:-9deg}35%{rotate:9deg}55%{rotate:-7deg}75%{rotate:6deg}}
@keyframes isha-nod{0%,100%{rotate:0deg;translate:0 0}30%{rotate:5deg;translate:0 2px}60%{rotate:-3deg}}
@keyframes isha-shadow{0%,100%{scale:1 1;opacity:1}50%{scale:.7 1;opacity:.5}}
@keyframes isha-breathe{0%,100%{translate:0 0;scale:1 1;rotate:0deg}40%{translate:0 -3px;scale:.99 1.015}70%{rotate:1.2deg}}
.isha-say{position:absolute;bottom:calc(100% + 6px);left:50%;translate:-50% 0;width:max-content;max-width:min(320px,76vw);background:#17181b;color:#fff;
  font:500 13px/1.35 "Golos Text",system-ui,sans-serif;padding:8px 11px;border-radius:12px;box-shadow:0 6px 18px rgba(0,0,0,.25);opacity:0;
  transition:opacity .25s;pointer-events:none;text-wrap:balance}
.isha-say::after{content:"";position:absolute;top:100%;left:50%;translate:-50% 0;border:6px solid transparent;border-top-color:#17181b}
.isha.say .isha-say{opacity:1}
.isha-x{position:absolute;top:-4px;right:-10px;width:22px;height:22px;border-radius:50%;border:0;background:#17181b;color:#fff;font-size:13px;line-height:1;
  cursor:pointer;opacity:0;transition:opacity .2s}
.isha-in:hover .isha-x,.isha-x:focus-visible{opacity:.9}
.isha-back{position:fixed;right:10px;bottom:calc(10px + env(safe-area-inset-bottom,0px));z-index:60;border:1px solid rgba(127,127,127,.4);background:#fff;color:#17181b;
  border-radius:999px;padding:4px 10px 4px 4px;font:500 12px "Golos Text",system-ui,sans-serif;display:flex;align-items:center;gap:6px;cursor:pointer}
.isha-back img{height:24px;width:auto}
.logo-isha{display:inline-flex;align-items:center;gap:8px}
.logo-isha img{height:30px;width:auto}
@media (max-width:640px){.isha img{height:92px}}
.isha.up .isha-in::before{scale:.8 1}
@media (prefers-reduced-motion:reduce){.isha{transition:none}.isha-in{transition:none}.isha img{animation:none!important}}
@media print{.isha,.isha-back{display:none}}
[hidden]{display:none!important}
.isha.right .isha-say{left:auto;right:-8px;translate:0 0}
.isha.right .isha-say::after{left:auto;right:calc(8px + var(--half,40px));translate:50% 0}
.isha.leftside .isha-say{left:-8px;translate:0 0}
.isha.leftside .isha-say::after{left:calc(8px + var(--half,40px));translate:-50% 0}
.isha.peek-l .isha-say{rotate:-24deg;left:120%;translate:-30% 0}
.isha.peek-r .isha-say{rotate:24deg;left:-20%;translate:-70% 0}

.isha.sit img{animation:isha-sit 2.6s ease-in-out infinite}
@keyframes isha-sit{0%,100%{rotate:-1.5deg}50%{rotate:1.5deg}}
.isha.sit .isha-in::before{opacity:0}
/* 06.10.2026, краш-тест: на телефоне наведения нет — крестик виден всегда и попадает пальцем (40 px);
   облачко уже и прижато к низу, чтобы не ложиться на лицо в «было/стало» и не уходить за край экрана */
@media (hover:none),(max-width:700px){
  .isha-x{opacity:.9;width:40px;height:40px;top:-14px;right:-18px;font-size:18px}
  .isha-say{max-width:min(240px,calc(100vw - 40px));font-size:13px}
}