.chatbtn,.chatpanel{
  --c-paper:var(--paper,#F6F9FD);--c-paper2:var(--paper-2,#EDF2F8);--c-plate:var(--plate,#E5EBF3);
  --c-ink:var(--ink,#191614);--c-ink2:var(--ink-2,#4A4540);--c-stone:var(--stone,#615A4F);
  --c-accent:var(--accent,#2E6E8E);--c-deep:var(--accent-deep,#215469);--c-soft:var(--accent-soft,#DDEDF6);
  --c-hair:var(--hair,rgba(25,22,20,.11));--c-hair2:var(--hair-2,rgba(25,22,20,.24));
  --c-sans:var(--sans,'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif);
  --c-fs1:var(--fs-1,13px);--c-fs2:var(--fs-2,15px);--c-fs3:var(--fs-3,17px);
  font-family:var(--c-sans);box-sizing:border-box;
}
.chatbtn *,.chatpanel *{box-sizing:border-box}

.chatbtn{position:fixed;left:26px;bottom:calc(var(--chat-b,0px) + 20px);z-index:100;
  display:flex;align-items:center;justify-content:center;width:60px;height:60px;padding:0;border-radius:999px;
  border:1px solid var(--c-hair2);background:var(--c-paper);color:var(--c-ink);cursor:pointer;
  font:600 var(--c-fs2)/1 var(--c-sans);letter-spacing:-.005em;
  box-shadow:0 10px 30px rgba(25,22,20,.18),0 2px 6px rgba(25,22,20,.08);
  transition:transform .2s cubic-bezier(.2,.7,.2,1),box-shadow .2s,bottom .25s ease,opacity .2s,visibility 0s}
.chatbtn[hidden]{display:none}
.chatbtn:hover{transform:translateY(-2px);box-shadow:0 14px 36px rgba(25,22,20,.22),0 2px 6px rgba(25,22,20,.08)}
.chatbtn-face{flex:none;width:50px;height:50px;border-radius:50%;background:var(--c-soft);display:block}
.chatbtn-face .otis{width:100%;height:100%;display:block;overflow:visible}
.chatbtn:hover .otis-wave,.chatbtn:focus-visible .otis-wave{animation:otisWave .55s ease-in-out 3}
.chatbtn:hover .otis-wave-l,.chatbtn:focus-visible .otis-wave-l{animation:otisWaveL .55s ease-in-out 3}
.chatOn .chatbtn{opacity:0;visibility:hidden;transform:scale(.85);transition:transform .2s,opacity .15s,visibility 0s .2s}
.chatbtn.hello .chatbtn-face .otis{animation:otisHop 1.1s cubic-bezier(.3,1.5,.5,1) 2}
.chatbtn.hello .otis-wave{animation:otisWave .55s ease-in-out 4}
.chatbtn.hello .otis-wave-l{animation:otisWaveL .55s ease-in-out 4}

.chatpanel{position:fixed;left:26px;bottom:calc(var(--chat-b,0px) + 20px);z-index:100;
  width:min(390px,calc(100vw - 40px));height:min(640px,calc(100vh - var(--chat-b,0px) - 120px));
  height:min(640px,calc(100dvh - var(--chat-b,0px) - 120px));min-height:340px;
  display:flex;flex-direction:column;background:var(--c-paper);color:var(--c-ink);
  border:1px solid var(--c-hair2);border-radius:18px;overflow:hidden;
  box-shadow:0 24px 60px rgba(25,22,20,.22),0 4px 14px rgba(25,22,20,.08);
  transform:translateY(16px) scale(.98);transform-origin:bottom left;opacity:0;pointer-events:none;visibility:hidden;
  transition:transform .24s cubic-bezier(.3,.8,.3,1),opacity .18s,visibility 0s .24s}
.chatpanel.on{transform:none;opacity:1;pointer-events:auto;visibility:visible;transition-delay:0s}

.chathd{flex:none;display:flex;align-items:center;gap:12px;padding:12px 10px 12px 14px;
  border-bottom:1px solid var(--c-hair);background:var(--c-paper2)}
.chatava{flex:none;width:42px;height:42px;border-radius:50%;background:var(--c-soft);overflow:hidden;display:block}
.chatava .otis{width:100%;height:100%;display:block;transform:translateY(3px)}
.chatwho{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.chatwho b{font:400 21px/1.1 'DM Serif Display',Georgia,serif;letter-spacing:-.005em;outline:0}
.chatwho span{font-size:var(--c-fs1);color:var(--c-stone);line-height:1.3}
.chatnew,.chatclose{flex:none;width:40px;height:40px;display:grid;place-items:center;border:0;border-radius:50%;
  background:none;color:var(--c-stone);cursor:pointer;padding:0;margin:0;font:400 26px/1 var(--c-sans);
  transition:background .16s,color .16s}
.chatnew:hover,.chatclose:hover{background:var(--c-plate);color:var(--c-ink)}
.chatnew svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

.chatlog{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:16px 14px 10px;
  display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth}
.chathi{text-align:center;padding:6px 6px 4px}
.chathi[hidden]{display:none}
.chathi .otis-big{width:118px;height:118px;display:block;margin:0 auto 6px;animation:otisIn .6s cubic-bezier(.3,1.5,.5,1) both}
.chatOn .chathi .otis-big .otis-wave{animation:otisWave .55s ease-in-out .7s 3}
.chatOn .chathi .otis-big .otis-wave-l{animation:otisWaveL .55s ease-in-out .7s 3}
.chathi1{margin:0;font:400 23px/1.2 'DM Serif Display',Georgia,serif;color:var(--c-ink)}
.chathi2{margin:6px auto 14px;max-width:30ch;font-size:var(--c-fs2);line-height:1.5;color:var(--c-ink2)}
.chatchips{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.chatchips button{border:1px solid var(--c-hair2);background:var(--c-paper);color:var(--c-ink);border-radius:6px;
  padding:8px 14px;font:500 var(--c-fs1)/1.2 var(--c-sans);cursor:pointer;transition:background .16s,border-color .16s,color .16s}
.chatchips button:hover{background:var(--c-soft);border-color:var(--c-accent);color:var(--c-deep)}

.chatrow{display:flex;align-items:flex-end;gap:8px;max-width:100%}
.chatrow.me{justify-content:flex-end}
.chatrow .chatava.sm{width:30px;height:30px}
.chatcol{display:flex;flex-direction:column;gap:6px;min-width:0;max-width:calc(100% - 38px)}
.chatmsg{font-size:var(--c-fs2);line-height:1.5;padding:9px 13px;border-radius:16px;overflow-wrap:anywhere;min-width:0}
.chatrow.me .chatmsg{max-width:85%;background:var(--c-accent);color:#fff;border-bottom-right-radius:5px;white-space:pre-wrap}
.chatrow.otis .chatmsg{background:var(--c-paper2);border:1px solid var(--c-hair);color:var(--c-ink);border-bottom-left-radius:5px}
.chatrow.otis.chatnote .chatmsg{background:var(--c-paper);border-style:dashed;color:var(--c-ink2);max-width:calc(100% - 38px)}
.chatmsg p{margin:0}
.chatmsg p+p,.chatmsg p+ul,.chatmsg p+ol,.chatmsg ul+p,.chatmsg ol+p{margin-top:8px}
.chatmsg ul,.chatmsg ol{margin:6px 0 0;padding-left:20px}
.chatmsg li+li{margin-top:3px}
.chatmsg strong{font-weight:650}
.chatrow.otis .chatmsg a{color:var(--c-deep);text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:1px}
.chatrow.otis .chatmsg a:hover{color:var(--c-accent)}
.chatretry{margin-top:8px;border:1px solid var(--c-hair2);background:var(--c-paper);color:var(--c-ink);border-radius:6px;
  padding:6px 13px;font:600 var(--c-fs1)/1.2 var(--c-sans);cursor:pointer}
.chatretry:hover{border-color:var(--c-ink)}

.chatcards{display:flex;flex-direction:column;gap:6px}
.chatcard{display:flex;align-items:center;gap:10px;padding:6px 10px 6px 6px;border:1px solid var(--hair,rgba(25,22,20,.11));border-radius:12px;
  background:var(--c-paper);color:var(--c-ink);text-decoration:none;transition:border-color .16s,background .16s}
.chatcard:hover{border-color:var(--c-accent);background:var(--c-soft)}
.chatcard img{flex:none;width:64px;height:40px;object-fit:contain;background:#fff;border-radius:7px}
.chatcard span{display:flex;flex-direction:column;min-width:0}
.chatcard b{font-size:var(--c-fs2);font-weight:600;line-height:1.25}
.chatcard small{font-size:var(--c-fs1);color:var(--stone,#615A4F);line-height:1.3}

.chatdots{display:flex;align-items:center;gap:5px;padding:13px 15px;border-radius:16px;border-bottom-left-radius:5px;
  background:var(--c-paper2);border:1px solid var(--c-hair)}
.chatdots i{width:7px;height:7px;border-radius:50%;background:var(--c-stone);opacity:.35;animation:chatDot 1.2s infinite ease-in-out}
.chatdots i:nth-of-type(2){animation-delay:.18s}
.chatdots i:nth-of-type(3){animation-delay:.36s}
.chatwait{align-self:center;font-size:var(--c-fs1);color:var(--c-stone);white-space:nowrap}
.chatrow.typing .otis-eyes{transform:translate(1.6px,-2.4px);transition:transform .3s}
.chatrow.typing .otis-glint{animation:otisGlint 1.6s ease-in-out infinite}
.chatThinking .chathd .otis-eyes{transform:translate(1.6px,-2.4px);transition:transform .3s}

.chatform{flex:none;display:flex;align-items:flex-end;gap:8px;padding:10px 10px 10px 14px;border-top:1px solid var(--c-hair);background:var(--c-paper)}
.chatform textarea{flex:1;min-width:0;resize:none;border:1px solid var(--c-hair2);border-radius:14px;background:var(--c-paper);color:var(--c-ink);
  font:400 var(--c-fs2)/1.45 var(--c-sans);padding:10px 12px;max-height:132px;outline:0;transition:border-color .16s,box-shadow .16s}
.chatform textarea:focus{border-color:var(--c-accent);box-shadow:0 0 0 3px var(--c-soft)}
.chatform textarea::placeholder{color:var(--c-stone);opacity:.85}
.chatsend{flex:none;width:44px;height:44px;border-radius:50%;border:0;background:var(--c-accent);color:#fff;display:grid;place-items:center;
  cursor:pointer;transition:background .16s,transform .16s}
.chatsend:hover{background:var(--c-accent);filter:brightness(.86)}
.chatsend:disabled{opacity:.45;cursor:default}
.chatsend svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.chatfine{flex:none;margin:0;padding:0 14px 10px;font-size:var(--c-fs1);line-height:1.4;color:var(--c-stone);background:var(--c-paper)}
.chatfine a{color:inherit;text-decoration:underline;text-underline-offset:2px}

.chatpanel .srlive{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.chatpanel .fbhp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.chatbtn:focus-visible,.chatpanel :focus-visible{outline:2px solid var(--c-accent);outline-offset:2px}

.otis-lids{transform-box:fill-box;transform-origin:50% 0;transform:scaleY(0);animation:otisBlink 5.5s infinite}
.otis-wave{transform-box:fill-box;transform-origin:25% 10%}
.otis-wave-l{transform-box:fill-box;transform-origin:75% 10%}
.otis-glint{transform-box:fill-box}
@keyframes otisBlink{0%,93%,100%{transform:scaleY(0)}95.5%{transform:scaleY(1)}}
@keyframes otisWave{0%,100%{transform:rotate(0)}50%{transform:rotate(-44deg)}}
@keyframes otisWaveL{0%,100%{transform:rotate(0)}50%{transform:rotate(44deg)}}
@keyframes otisHop{0%,100%{transform:translateY(3px)}40%{transform:translateY(-6px)}70%{transform:translateY(3px) scaleY(.96)}}
@keyframes otisIn{from{opacity:0;transform:translateY(10px) scale(.92)}to{opacity:1;transform:none}}
@keyframes otisGlint{0%,100%{opacity:.8}50%{opacity:.15}}
@keyframes chatDot{0%,60%,100%{opacity:.35;transform:none}30%{opacity:1;transform:translateY(-3px)}}

@media(max-width:767px){
  .chatbtn{left:16px;height:58px;width:58px}
  .chatbtn-face{width:48px;height:48px}
  .chatpanel{left:16px}
}
@media(max-width:560px){
  .chatbtn{left:10px;bottom:calc(var(--chat-b,0px) + 8px)}
  .chatpanel{left:0;right:0;top:0;bottom:0;width:auto;height:100vh;height:100dvh;min-height:0;border-radius:0;border:0;
    transform:translateY(24px);transform-origin:bottom center}
  .chatpanel.on{transform:none;z-index:160}
  html.chatOn,html.chatOn body{overflow:hidden}
  .chatform textarea{font-size:var(--c-fs3)}
  .chathd{padding-top:max(12px,env(safe-area-inset-top))}
  .chatfine{padding-bottom:max(10px,env(safe-area-inset-bottom))}
  .chatpanel[data-staff] .chathd{padding-top:64px}
}
body:has(.tray.on) :is(.chatbtn,.chatpanel){visibility:hidden}
body:has(.qv.on) :is(.chatbtn,.chatpanel){visibility:hidden}
@media(max-width:1120px){body:has(.mnav.open) :is(.chatbtn,.chatpanel){visibility:hidden}}
@media(max-width:480px){body:has(#fbPanel.on) .chatbtn{visibility:hidden}}

@media(prefers-reduced-motion:reduce){
  .chatbtn,.chatpanel,.chatbtn-face .otis{transition:none;animation:none}
  .otis-lids,.otis-glint,.chathi .otis-big,.chatbtn.hello .chatbtn-face .otis,.chatdots i{animation:none}
  .otis-wave,.chatbtn:hover .otis-wave,.chatbtn:focus-visible .otis-wave,.chatOn .chathi .otis-big .otis-wave,.chatbtn.hello .otis-wave,
  .otis-wave-l,.chatbtn:hover .otis-wave-l,.chatbtn:focus-visible .otis-wave-l,.chatOn .chathi .otis-big .otis-wave-l,.chatbtn.hello .otis-wave-l{animation:none!important}
  .chatlog{scroll-behavior:auto}
}
@media print{.chatbtn,.chatpanel{display:none!important}}
