/* MKR chat widget — тёмный премиум в стиле сайта */
.mkr-chat{position:fixed;right:18px;bottom:18px;z-index:9998;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}

/* Кнопка */
.mkr-chat .mkr-chat__fab{position:relative;width:58px;height:58px;padding:0;border-radius:50%;cursor:pointer;
  display:flex;align-items:center;justify-content:center;border:1px solid transparent;color:#f8faff;
  background:linear-gradient(180deg,rgba(7,8,13,.96),rgba(5,6,8,.96)) padding-box,
             linear-gradient(135deg,rgba(46,105,246,.85),rgba(105,66,251,.85),rgba(212,92,255,.85)) border-box;
  box-shadow:0 10px 30px rgba(0,0,0,.5),0 0 24px rgba(105,66,251,.28);
  transition:transform 280ms ease,box-shadow 280ms ease}
.mkr-chat .mkr-chat__fab:hover,.mkr-chat .mkr-chat__fab:focus-visible{transform:translateY(-2px);
  box-shadow:0 14px 36px rgba(0,0,0,.55),0 0 34px rgba(105,66,251,.45)}
/* привлечение внимания: расходящееся кольцо + пульс свечения + покачивание робота */
.mkr-chat:not(.is-open) .mkr-chat__fab::before{content:"";position:absolute;inset:-2px;border-radius:50%;
  border:2px solid rgba(140,100,255,.65);opacity:0;pointer-events:none;
  animation:mkr-chat-ping 4.4s ease-out infinite}
/* свечение — отдельный статичный blur-слой, анимируется только opacity (композиция, без paint) */
.mkr-chat__fab::after{content:"";position:absolute;inset:-7px;border-radius:50%;z-index:0;pointer-events:none;
  background:radial-gradient(circle,rgba(105,66,251,.6),transparent 70%);filter:blur(10px);opacity:0}
.mkr-chat:not(.is-open) .mkr-chat__fab::after{animation:mkr-chat-glow 4.4s ease-in-out infinite}
.mkr-chat__fab-ico,.mkr-chat__fab-x{z-index:1}
.mkr-chat:not(.is-open) .mkr-chat__fab-ico{animation:mkr-chat-wiggle 4.4s ease-in-out infinite}
@keyframes mkr-chat-ping{
  0%{transform:scale(.9);opacity:0}
  6%{opacity:.8}
  32%{transform:scale(1.8);opacity:0}
  100%{transform:scale(1.8);opacity:0}}
@keyframes mkr-chat-glow{
  0%,40%,100%{opacity:0}
  14%{opacity:.85}}
@keyframes mkr-chat-wiggle{
  0%,3%,21%,100%{transform:rotate(0)}
  7%{transform:rotate(-14deg) scale(1.08)}
  12%{transform:rotate(11deg) scale(1.08)}
  17%{transform:rotate(-7deg)}}
@media(prefers-reduced-motion:reduce){
  .mkr-chat:not(.is-open) .mkr-chat__fab::before,
  .mkr-chat:not(.is-open) .mkr-chat__fab::after,
  .mkr-chat:not(.is-open) .mkr-chat__fab-ico{animation:none}}
.mkr-chat__fab-ico,.mkr-chat__fab-x{width:26px;height:26px;position:absolute;transition:opacity 220ms ease,transform 220ms ease}
.mkr-chat__fab-x{opacity:0;transform:rotate(-45deg) scale(.6)}
.mkr-chat.is-open .mkr-chat__fab-ico{opacity:0;transform:rotate(45deg) scale(.6)}
.mkr-chat.is-open .mkr-chat__fab-x{opacity:1;transform:rotate(0) scale(1)}

/* Панель */
.mkr-chat__panel{position:absolute;right:0;bottom:72px;width:372px;max-width:calc(100vw - 24px);
  height:520px;max-height:calc(100dvh - 110px);display:flex;flex-direction:column;overflow:hidden;
  border:1px solid transparent;border-radius:16px;
  background:radial-gradient(circle at 16% 0,rgba(105,66,251,.32),transparent 52%) padding-box,
             radial-gradient(circle at 92% 96%,rgba(46,105,246,.22),transparent 50%) padding-box,
             linear-gradient(180deg,rgba(11,13,22,.97),rgba(6,7,13,.97)) padding-box,
             linear-gradient(135deg,rgba(46,105,246,.5),rgba(105,66,251,.5),rgba(212,92,255,.5)) border-box;
  box-shadow:0 18px 60px rgba(0,0,0,.6);backdrop-filter:blur(12px);
  opacity:0;transform:translateY(10px) scale(.98);pointer-events:none;
  /* visibility:hidden в закрытом виде — иначе невидимая панель с backdrop-filter
     компонуется на каждом кадре и тормозит анимации страницы */
  visibility:hidden;
  transition:opacity 260ms ease,transform 260ms ease,visibility 0s linear 280ms}
.mkr-chat.is-open .mkr-chat__panel{visibility:visible;transition-delay:0s}
.mkr-chat__panel[hidden]{display:flex}
/* фирменный паттерн MKR — как на нижних баннерах лендингов */
.mkr-chat__panel::before{content:"";position:absolute;inset:0;border-radius:inherit;
  background-image:url("img/mkr-pattern.webp");background-size:300px;
  filter:grayscale(1) brightness(.7);opacity:.09;pointer-events:none}
.mkr-chat__head,.mkr-chat__log,.mkr-chat__form{position:relative;z-index:1}
.mkr-chat.is-open .mkr-chat__panel{opacity:1;transform:translateY(0) scale(1);pointer-events:auto}

/* Шапка */
.mkr-chat__head{display:flex;align-items:center;gap:12px;padding:14px 16px;
  border-bottom:1px solid rgba(255,255,255,.08)}
.mkr-chat__dot{width:9px;height:9px;border-radius:50%;background:#4ade80;flex:0 0 auto;
  box-shadow:0 0 10px rgba(74,222,128,.7)}
.mkr-chat__head-txt{flex:1;display:flex;flex-direction:column;gap:2px;min-width:0}
.mkr-chat__head-txt strong{font-size:.95rem;font-weight:640;color:#f8faff;letter-spacing:.01em}
.mkr-chat__head-txt span{font-size:.75rem;color:rgba(216,222,234,.6)}
.mkr-chat .mkr-chat__close{width:32px;height:32px;padding:0;border:0;border-radius:8px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;background:transparent;color:rgba(216,222,234,.6);
  transition:background 220ms ease,color 220ms ease}
.mkr-chat .mkr-chat__close:hover{background:rgba(255,255,255,.07);color:#f8faff}
.mkr-chat__close svg{width:16px;height:16px}

/* Лента */
.mkr-chat__log{flex:1;overflow-y:auto;padding:16px 14px;display:flex;flex-direction:column;gap:10px;
  scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.18) transparent}
.mkr-chat__msg{max-width:86%;padding:10px 14px;border-radius:14px;font-size:.9rem;line-height:1.5;
  white-space:pre-wrap;overflow-wrap:break-word}
.mkr-chat__msg--bot{align-self:flex-start;background:rgba(255,255,255,.06);color:rgba(226,231,241,.92);
  border:1px solid rgba(255,255,255,.07);border-bottom-left-radius:5px}
.mkr-chat__msg--user{align-self:flex-end;color:#f8faff;border-bottom-right-radius:5px;
  background:linear-gradient(135deg,rgba(46,105,246,.85),rgba(105,66,251,.85))}
.mkr-chat__msg--err{align-self:flex-start;background:rgba(255,80,80,.1);border:1px solid rgba(255,80,80,.25);
  color:rgba(255,190,190,.9);border-bottom-left-radius:5px}

/* Индикатор набора */
.mkr-chat__typing{align-self:flex-start;display:flex;gap:5px;padding:12px 16px;border-radius:14px;
  border-bottom-left-radius:5px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.07)}
.mkr-chat__typing i{width:6px;height:6px;border-radius:50%;background:rgba(216,222,234,.65);
  animation:mkr-chat-blink 1.2s infinite}
.mkr-chat__typing i:nth-child(2){animation-delay:.2s}
.mkr-chat__typing i:nth-child(3){animation-delay:.4s}
@keyframes mkr-chat-blink{0%,60%,100%{opacity:.25;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}

/* Форма */
.mkr-chat__form{display:flex;align-items:flex-end;gap:8px;padding:12px;
  border-top:1px solid rgba(255,255,255,.08)}
.mkr-chat .mkr-chat__input{flex:1;resize:none;border:1px solid rgba(255,255,255,.12);border-radius:10px;
  background:rgba(255,255,255,.04);color:#f8faff;font:inherit;font-size:.9rem;line-height:1.45;
  padding:9px 12px;max-height:110px;outline:none;transition:border-color 220ms ease}
.mkr-chat .mkr-chat__input::placeholder{color:rgba(216,222,234,.45)}
.mkr-chat .mkr-chat__input:focus{border-color:rgba(105,66,251,.65)}
.mkr-chat .mkr-chat__send{width:40px;height:40px;padding:0;flex:0 0 auto;border:1px solid transparent;border-radius:10px;
  cursor:pointer;display:flex;align-items:center;justify-content:center;color:#f8faff;
  background:linear-gradient(180deg,rgba(5,6,8,.78),rgba(5,6,8,.78)) padding-box,
             linear-gradient(135deg,rgba(46,105,246,.72),rgba(105,66,251,.72),rgba(212,92,255,.72)) border-box;
  transition:background 280ms ease,opacity 220ms ease}
.mkr-chat .mkr-chat__send:hover:not(:disabled),.mkr-chat .mkr-chat__send:focus-visible{
  background:linear-gradient(180deg,rgba(5,6,8,.78),rgba(5,6,8,.78)) padding-box,
             linear-gradient(135deg,#2e69f6,#6942fb,#d45cff) border-box}
.mkr-chat .mkr-chat__send:disabled{opacity:.45;cursor:default}
.mkr-chat__send svg{width:20px;height:20px;flex:0 0 20px;min-width:20px}
.mkr-chat__close svg{flex:0 0 16px;min-width:16px}

/* Мобильный */
@media(max-width:480px){
  .mkr-chat{right:12px;bottom:12px}
  .mkr-chat .mkr-chat__fab{width:52px;height:52px}
  .mkr-chat__panel{position:fixed;left:12px;right:12px;bottom:76px;width:auto;
    height:auto;top:max(12px,env(safe-area-inset-top,0px))}
}