/* "Ask my AI" widget. Uses the site's own color tokens so it reads as part of the page. */
#cm-chat{
  --c-navy:var(--accent,#1e3a8a);
  --c-blue:var(--accent-2,#2563eb);
  --c-ink:var(--text,#14213d);
  --c-muted:var(--muted,#566077);
  --c-line:var(--line,#d7deea);
  --c-paper:#ffffff;
  --c-wash:var(--panel-2,#f6f8fb);
  --c-live:var(--live,#15803d);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  position:fixed;right:20px;bottom:20px;z-index:100;
}
#cm-chat *{box-sizing:border-box}

/* launcher */
.cm-launch{
  display:flex;align-items:center;gap:10px;
  padding:12px 18px 12px 14px;border:0;border-radius:999px;cursor:pointer;
  background:var(--c-navy);color:#fff;font:600 .95rem/1 inherit;font-family:inherit;
  box-shadow:0 10px 28px -8px rgba(20,33,61,.55),0 2px 6px rgba(20,33,61,.25);
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
  animation:cm-rise .5s .6s both cubic-bezier(.2,.8,.2,1);
}
.cm-launch:hover{transform:translateY(-2px);background:var(--c-blue)}
.cm-launch:focus-visible,.cm-send:focus-visible,.cm-chip:focus-visible,
.cm-icon:focus-visible,.cm-input:focus-visible{outline:3px solid #93c5fd;outline-offset:2px}
.cm-dot{width:9px;height:9px;border-radius:50%;background:#4ade80;position:relative;flex:none}
.cm-dot::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:2px solid #4ade80;opacity:0;animation:cm-ping 2.4s infinite}
#cm-chat.open .cm-launch{display:none}

/* panel */
.cm-panel{
  display:none;flex-direction:column;
  width:min(390px,calc(100vw - 24px));height:min(600px,calc(100vh - 40px));
  background:var(--c-paper);border:1px solid var(--c-line);border-radius:18px;overflow:hidden;
  box-shadow:0 28px 60px -18px rgba(20,33,61,.45),0 6px 16px rgba(20,33,61,.12);
}
#cm-chat.open .cm-panel{display:flex;animation:cm-pop .28s cubic-bezier(.2,.8,.2,1)}

.cm-head{
  background:var(--c-navy);color:#fff;padding:14px 14px 16px 18px;position:relative;
  display:flex;align-items:flex-start;gap:10px;
}
.cm-title{flex:1;min-width:0}
.cm-title b{display:block;font-size:1.02rem;letter-spacing:.2px}
.cm-title span{display:block;margin-top:3px;font-size:.78rem;color:#c7d2fe;line-height:1.35}
.cm-icon{
  width:32px;height:32px;border:0;border-radius:8px;background:rgba(255,255,255,.12);color:#fff;
  cursor:pointer;font-size:1.05rem;line-height:1;flex:none;transition:background .15s;
}
.cm-icon:hover{background:rgba(255,255,255,.25)}
/* lane-marking stripe along the bottom of the header, a nod to the road */
.cm-head::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:3px;
  background:repeating-linear-gradient(90deg,#fbbf24 0 16px,transparent 16px 28px);
  opacity:.9;
}

.cm-log{flex:1;overflow-y:auto;padding:16px 16px 6px;background:var(--c-wash);scroll-behavior:smooth}
.cm-msg{max-width:88%;margin:0 0 10px;padding:10px 13px;border-radius:14px;font-size:.93rem;line-height:1.5;
  word-wrap:break-word;overflow-wrap:anywhere;animation:cm-fade .25s ease both}
.cm-msg.bot{background:var(--c-paper);color:var(--c-ink);border:1px solid var(--c-line);border-bottom-left-radius:4px}
.cm-msg.me{background:var(--c-navy);color:#fff;margin-left:auto;border-bottom-right-radius:4px}
.cm-msg.err{background:#fef2f2;border-color:#fecaca;color:#991b1b}
.cm-msg p{margin:0 0 .55em}.cm-msg p:last-child{margin-bottom:0}
.cm-msg ul{margin:.3em 0 .55em 1.15em}.cm-msg li{margin:.15em 0}
.cm-msg a{color:var(--c-blue);text-decoration:underline;text-underline-offset:2px}
.cm-msg.me a{color:#bfdbfe}
.cm-typing{display:inline-flex;gap:4px;padding:3px 0}
.cm-typing i{width:6px;height:6px;border-radius:50%;background:var(--c-muted);opacity:.4;animation:cm-bounce 1s infinite}
.cm-typing i:nth-child(2){animation-delay:.15s}.cm-typing i:nth-child(3){animation-delay:.3s}

.cm-chips{display:flex;flex-wrap:wrap;gap:8px;padding:2px 0 10px}
.cm-chip{
  border:1px solid var(--c-line);background:var(--c-paper);color:var(--c-navy);cursor:pointer;
  padding:8px 12px;border-radius:999px;font:600 .82rem/1.2 inherit;font-family:inherit;
  transition:border-color .15s,background .15s,transform .15s;
}
.cm-chip:hover{border-color:var(--c-navy);background:#eef2ff;transform:translateY(-1px)}

.cm-form{display:flex;gap:8px;padding:12px;border-top:1px solid var(--c-line);background:var(--c-paper)}
.cm-input{
  flex:1;min-width:0;border:1px solid var(--c-line);border-radius:12px;padding:11px 13px;
  font:.93rem/1.3 inherit;font-family:inherit;color:var(--c-ink);background:var(--c-wash);resize:none;max-height:96px;
}
.cm-send{
  border:0;border-radius:12px;padding:0 16px;background:var(--c-navy);color:#fff;cursor:pointer;
  font:600 .9rem/1 inherit;font-family:inherit;transition:background .15s,opacity .15s;
}
.cm-send:hover{background:var(--c-blue)}
.cm-send:disabled{opacity:.45;cursor:not-allowed}
.cm-foot{padding:0 14px 10px;background:var(--c-paper);font-size:.72rem;color:var(--c-muted);text-align:center}

@keyframes cm-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes cm-pop{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
@keyframes cm-fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes cm-ping{0%{opacity:.7;transform:scale(.6)}70%,100%{opacity:0;transform:scale(1.6)}}
@keyframes cm-bounce{0%,80%,100%{transform:translateY(0)}40%{transform:translateY(-4px);opacity:.9}}

@media(max-width:520px){
  #cm-chat{right:12px;bottom:12px}
  #cm-chat.open{right:0;bottom:0;left:0}
  #cm-chat.open .cm-panel{width:100vw;height:min(86vh,640px);border-radius:18px 18px 0 0;border-bottom:0}
}
@media(prefers-reduced-motion:reduce){
  #cm-chat *,#cm-chat *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
