/* Мурлин — плавающий ИИ-ассистент. Токены (--paper, --ink, --violet, --r-lg…) —
   из app.css, этот файл подключается после него и ничего не переопределяет. */

.mrl-fab{
  position:fixed;right:16px;bottom:calc(var(--tabh) + 16px);z-index:50;
  width:56px;height:56px;border-radius:50%;padding:0;
  background:var(--paper);border:2px solid var(--violet);box-shadow:var(--shadow-lift);
  display:grid;place-items:center;overflow:hidden;
  transition:transform .15s ease;
}
.mrl-fab:hover{transform:scale(1.06)}
.mrl-fab:active{transform:scale(.96)}
.mrl-fab img{width:100%;height:100%;object-fit:cover}
.mrl-fab-dot{position:absolute;top:4px;right:4px;width:12px;height:12px;border-radius:50%;
  background:var(--mint);border:2px solid var(--paper)}

/* баблы-подбадривания: появляются над значком, сами гаснут */
.mrl-bubble{
  position:fixed;right:16px;bottom:calc(var(--tabh) + 84px);z-index:49;
  max-width:240px;background:var(--paper);color:var(--ink);border:1.5px solid var(--line);
  border-radius:var(--r-lg) var(--r-lg) var(--r-lg) 6px;box-shadow:var(--shadow-lift);
  padding:11px 14px;font-size:14px;line-height:1.5;
  opacity:0;transform:translateY(6px) scale(.96);transition:opacity .22s ease,transform .22s ease;
  pointer-events:none;
}
.mrl-bubble.is-on{opacity:1;transform:none;pointer-events:auto}

/* панель чата */
.mrl-chat{
  position:fixed;right:12px;left:12px;bottom:calc(var(--tabh) + 16px);z-index:51;
  max-width:380px;margin-left:auto;height:min(520px, 72vh);
  background:var(--paper);border:1.5px solid var(--line);border-radius:var(--r-xl);
  box-shadow:var(--shadow-lift);display:flex;flex-direction:column;overflow:hidden;
  animation:murpop .22s cubic-bezier(.2,1.1,.4,1);
}
@keyframes murpop{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}

.mrl-chat-head{display:flex;align-items:center;gap:10px;padding:12px 14px;
  border-bottom:1.5px solid var(--line-soft);background:var(--violet-bg);flex:0 0 auto}
.mrl-chat-face{width:36px;height:36px;border-radius:50%;object-fit:cover;border:2px solid var(--paper)}
.mrl-chat-name{font-weight:700;font-size:14.5px;color:var(--ink)}
.mrl-chat-sub{font-size:12px;color:var(--ink-soft)}
.mrl-chat-close{margin-left:auto;width:30px;height:30px;border-radius:50%;
  display:grid;place-items:center;color:var(--ink-soft)}
.mrl-chat-close:hover{background:rgba(58,48,64,.08);color:var(--ink)}

.mrl-chat-list{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:9px}
.mrl-msg{max-width:82%;padding:9px 13px;border-radius:var(--r);font-size:14px;line-height:1.5}
.mrl-msg--assistant{align-self:flex-start;background:var(--cream-2);color:var(--ink);
  border-radius:var(--r) var(--r) var(--r) 4px}
.mrl-msg--user{align-self:flex-end;background:var(--violet);color:#2E2650;
  border-radius:var(--r) var(--r) 4px var(--r)}
.mrl-msg--typing{color:var(--ink-faint);font-style:italic}

.mrl-pills{display:flex;flex-wrap:wrap;gap:7px;padding:0 14px 12px;flex:0 0 auto}
.mrl-pill{font-size:12.5px;padding:7px 12px;border-radius:100px;background:var(--paper);
  border:1.5px solid var(--line);color:var(--ink-soft)}
.mrl-pill:hover{border-color:var(--violet);color:var(--ink)}

.mrl-wiki-cta{margin:0 14px 12px;display:flex;align-items:center;justify-content:center;gap:7px;
  padding:9px 14px;border-radius:100px;background:var(--paper);border:1.5px solid var(--violet);
  color:var(--violet-dp);font-size:13px;font-weight:600;flex:0 0 auto}
.mrl-wiki-cta:hover{background:var(--violet-bg)}
.mrl-wiki-cta .ic{width:15px;height:15px}

.mrl-composer{display:flex;gap:8px;padding:10px 12px;border-top:1.5px solid var(--line-soft);flex:0 0 auto}
.mrl-composer input{flex:1}

@media(max-width:420px){
  .mrl-chat{left:8px;right:8px;bottom:calc(var(--tabh) + 8px);height:min(480px, 70vh)}
  .mrl-fab{right:12px}
  .mrl-bubble{right:12px;max-width:200px}
}

@media(prefers-reduced-motion: reduce){
  .mrl-chat{animation:none}
  .mrl-bubble{transition:opacity .01s linear}
}