/* ===== Dr. Manthan – interactive guide avatar (v3 light) ===== */
.avatar { position: fixed; left: 1.1rem; bottom: .6rem; z-index: 45; display: flex; flex-direction: column; align-items: flex-start; gap: .4rem; pointer-events: none; font-family: var(--sans); }
.avatar > * { pointer-events: auto; }
.avatar { transition: transform .6s var(--ease), opacity .4s; }
.avatar.is-hidden { transform: translateY(130%); opacity: 0; }
.avatar.is-hidden > * { pointer-events: none; }

.avatar__char { position: relative; background: none; border: 0; padding: 0; cursor: pointer; width: 140px; height: 182px; -webkit-tap-highlight-color: transparent; }
.avatar__char:focus-visible { outline: 2px solid var(--accent); outline-offset: 6px; border-radius: 16px; }
.av-svg { width: 100%; height: 100%; overflow: visible; filter: drop-shadow(0 6px 10px rgba(21,23,28,.18)); animation: av-bob 3.2s ease-in-out infinite; }
@keyframes av-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
.av-head { transition: transform .25s ease-out; }
.avatar.is-waving .av-arm-l { animation: av-wave 1.6s ease-in-out; }
@keyframes av-wave { 0% { transform: rotate(0); } 15% { transform: rotate(-150deg); } 30% { transform: rotate(-120deg); } 45% { transform: rotate(-155deg); } 60% { transform: rotate(-120deg); } 75% { transform: rotate(-150deg); } 100% { transform: rotate(0); } }
.av-bub { animation: av-bubble 1.8s ease-in infinite; }
.av-bub:nth-of-type(2) { animation-delay: .6s; } .av-bub:nth-of-type(3) { animation-delay: 1.2s; }
@keyframes av-bubble { 0% { transform: translateY(0); opacity: 0; } 20% { opacity: 1; } 100% { transform: translateY(-18px); opacity: 0; } }
.avatar.is-talking .av-mouth { animation: av-talk .22s ease-in-out infinite alternate; transform-origin: 100px 96px; }
@keyframes av-talk { from { transform: scaleY(.5); } to { transform: scaleY(1.25); } }
.av-lid { transition: transform .08s; }
.avatar__badge { position: absolute; right: 0; top: 24px; width: 20px; height: 20px; border-radius: 50%; background: var(--accent); color: #fff; font: 500 .72rem/20px var(--mono); text-align: center; border: 2px solid var(--paper); }
.avatar.has-bubble .avatar__badge, .avatar.is-min .avatar__badge { display: none; }

/* speech bubble */
.avatar__bubble { position: relative; max-width: 300px; background: var(--surface); color: var(--ink-2); border: 1px solid var(--line); border-radius: 14px 14px 14px 4px; padding: .9rem 1rem .85rem; box-shadow: var(--shadow-md); font-size: .92rem; line-height: 1.45; transform-origin: bottom left; opacity: 0; transform: translateY(8px) scale(.96); transition: opacity .25s, transform .3s var(--ease); pointer-events: none; }
.avatar.has-bubble .avatar__bubble { opacity: 1; transform: none; pointer-events: auto; }
.avatar__bubble::after { content: ""; position: absolute; left: 20px; bottom: -7px; width: 12px; height: 12px; background: var(--surface); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); transform: rotate(45deg); }
.avatar__name { display: block; font: 500 .66rem/1 var(--mono); letter-spacing: .12em; text-transform: uppercase; color: var(--accent); margin-bottom: .4rem; }
.avatar__text { margin: 0; min-height: 1.4em; color: var(--ink); }
.avatar__text .cur { display: inline-block; width: 1.5px; height: 1em; background: var(--accent); vertical-align: -2px; margin-left: 1px; animation: av-cur .7s steps(1) infinite; }
@keyframes av-cur { 50% { opacity: 0; } }
.avatar__actions { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .75rem; }
.avatar__actions:empty { display: none; }
.avatar__actions button { font: 600 .78rem/1 var(--sans); padding: .5rem .8rem; border-radius: 999px; border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink); cursor: pointer; transition: border-color .2s, background .2s, color .2s; }
.avatar__actions button:hover { border-color: var(--ink); }
.avatar__actions button.pri { background: var(--accent); color: #fff; border-color: var(--accent); }
.avatar__actions button.pri:hover { background: var(--accent-ink); border-color: var(--accent-ink); }
.avatar__step { position: absolute; right: .9rem; top: .85rem; font: 500 .62rem/1 var(--mono); color: var(--muted); letter-spacing: .08em; }
.avatar__close { position: absolute; right: -8px; top: -8px; width: 22px; height: 22px; border-radius: 50%; border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink); font-size: 13px; line-height: 20px; cursor: pointer; padding: 0; }
.avatar__close:hover { border-color: var(--ink); }

.avatar__tools { display: flex; gap: .35rem; margin-left: .4rem; }
.avatar__tools button { width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--line-strong); background: var(--surface); color: var(--ink); font-size: .8rem; cursor: pointer; display: grid; place-items: center; transition: border-color .2s, background .2s; }
.avatar__tools button:hover { border-color: var(--ink); }
.avatar__tools button[aria-pressed="true"] { background: var(--ink); color: #fff; border-color: var(--ink); }

.avatar.is-min .avatar__char { width: 60px; height: 78px; }
.avatar.is-min .avatar__bubble, .avatar.is-min .avatar__tools { display: none; }
.avatar.is-min .av-svg { animation: none; }
.avatar.is-min::after { content: "Dr. Manthan"; position: absolute; left: 66px; bottom: 26px; background: var(--ink); color: #fff; font: 500 .66rem/1 var(--mono); letter-spacing: .06em; padding: .35rem .55rem; border-radius: 4px; opacity: 0; transition: opacity .2s; white-space: nowrap; pointer-events: none; }
.avatar.is-min:hover::after { opacity: 1; }

@media (max-width: 760px) {
  .avatar { left: .75rem; bottom: .5rem; }
  .avatar__char { width: 92px; height: 120px; }
  .avatar__bubble { max-width: min(300px, calc(100vw - 6rem)); font-size: .86rem; }
  .avatar.is-min .avatar__char { width: 52px; height: 68px; }
}
@media (prefers-reduced-motion: reduce) {
  .av-svg, .av-bub, .avatar.is-waving .av-arm-l, .avatar.is-talking .av-mouth { animation: none !important; }
}