/* Milky chat widget */
#milky-launcher-label{
  position:fixed;
  bottom:154px;
  right:14px;
  z-index:61;
  background:#1f6293;
  color:#ffffff;
  font-family:'Inter',sans-serif;
  font-weight:700;
  font-size:12.5px;
  padding:8px 14px;
  border-radius:999px;
  box-shadow:0 10px 24px -10px rgba(22,50,74,0.5);
  white-space:nowrap;
  animation:milky-label-bounce 2.2s ease-in-out infinite;
  transition:opacity 0.2s ease, transform 0.2s ease;
}
#milky-launcher-label::after{
  content:"";
  position:absolute;
  bottom:-5px;
  right:22px;
  width:10px;
  height:10px;
  background:#1f6293;
  transform:rotate(45deg);
}
#milky-launcher-label.hidden{
  opacity:0;
  transform:translateY(6px);
  pointer-events:none;
}
@keyframes milky-label-bounce{
  0%, 100%{transform:translateY(0);}
  50%{transform:translateY(-5px);}
}
@media (prefers-reduced-motion: reduce){
  #milky-launcher-label{animation:none;}
}

#milky-launcher{
  position:fixed;
  bottom:90px;
  right:22px;
  z-index:60;
  width:58px;
  height:58px;
  border-radius:50%;
  background:#ffffff;
  border:2px solid #cbe6f7;
  box-shadow:0 12px 30px -10px rgba(22,50,74,0.4);
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  animation:milky-breathe 2.6s ease-in-out infinite;
}
#milky-launcher img{width:30px;height:30px;}
@keyframes milky-breathe{
  0%, 100%{transform:scale(1);}
  50%{transform:scale(1.1);}
}
#milky-launcher.open{animation:none;}
@media (prefers-reduced-motion: reduce){
  #milky-launcher{animation:none;}
}

#milky-panel{
  position:fixed;
  bottom:160px;
  right:22px;
  z-index:60;
  width:360px;
  max-width:calc(100vw - 32px);
  height:500px;
  max-height:calc(100vh - 200px);
  background:#ffffff;
  border-radius:20px;
  box-shadow:0 24px 60px -20px rgba(22,50,74,0.45);
  display:none;
  flex-direction:column;
  overflow:hidden;
  font-family:'Inter',sans-serif;
}
#milky-panel.open{display:flex;}

#milky-head{
  background:#1f6293;
  color:#ffffff;
  padding:14px 16px;
  display:flex;
  align-items:center;
  gap:10px;
}
#milky-head img{width:26px;height:26px;flex-shrink:0;}
#milky-head .milky-title{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:15px;}
#milky-head .milky-sub{font-size:11.5px;opacity:0.8;}
#milky-close{
  margin-left:auto;
  background:none;
  border:none;
  color:#ffffff;
  cursor:pointer;
  font-size:18px;
  line-height:1;
  padding:4px;
  opacity:0.8;
}
#milky-close:hover{opacity:1;}

#milky-messages{
  flex:1;
  overflow-y:auto;
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:10px;
  background:#f2f8fd;
}
.milky-msg{
  max-width:88%;
  padding:10px 13px;
  border-radius:14px;
  font-size:13.5px;
  line-height:1.5;
}
.milky-msg.bot{
  background:#ffffff;
  color:#16324a;
  align-self:flex-start;
  border-bottom-left-radius:4px;
}
.milky-msg.user{
  background:#1f6293;
  color:#ffffff;
  align-self:flex-end;
  border-bottom-right-radius:4px;
}
.milky-msg a{color:inherit;text-decoration:underline;}

.milky-typing{
  align-self:flex-start;
  background:#ffffff;
  border-radius:14px;
  border-bottom-left-radius:4px;
  padding:8px 14px;
  display:flex;
  align-items:center;
  gap:8px;
}
.milky-typing img{
  width:20px;
  height:20px;
  animation:milky-breathe 0.9s ease-in-out infinite;
}
.milky-typing span{font-size:12px;color:#5c7284;}

.milky-suggestions{
  padding:0 16px 10px;
  background:#f2f8fd;
}
.milky-suggestion-chip{
  display:inline-flex;
  align-items:center;
  background:#ffffff;
  border:1.5px solid #cbe6f7;
  color:#1f6293;
  border-radius:999px;
  padding:9px 14px;
  font-size:12.5px;
  font-weight:600;
  cursor:pointer;
  max-width:100%;
  text-align:left;
  min-height:20px;
}
.milky-suggestion-chip:hover{border-color:#1f6293;background:#f2f8fd;}
.milky-cursor{
  display:inline-block;
  margin-left:1px;
  animation:milky-blink 0.9s step-end infinite;
}
@keyframes milky-blink{
  0%, 100%{opacity:1;}
  50%{opacity:0;}
}

#milky-form{
  display:flex;
  gap:8px;
  padding:12px;
  border-top:1px solid #e3f1fb;
  background:#ffffff;
}
#milky-input{
  flex:1;
  border:1.5px solid #cbe6f7;
  border-radius:999px;
  padding:9px 14px;
  font-size:13.5px;
  font-family:inherit;
  outline:none;
}
#milky-input:focus{border-color:#1f6293;}
#milky-send{
  background:#1f6293;
  color:#ffffff;
  border:none;
  border-radius:999px;
  width:36px;
  height:36px;
  flex-shrink:0;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}
#milky-send:hover{background:#16324a;}
#milky-send svg{width:16px;height:16px;}

/* Preserve separate portfolio links on their own lines in Milky replies. */
.milky-msg.bot{white-space:pre-line;overflow-wrap:anywhere}

/* Roomier desktop chat; responsive on smaller screens. */
@media (min-width: 701px){
  #milky-panel{
    width: min(480px, calc(100vw - 44px));
    height: min(650px, calc(100dvh - 185px));
    max-height: calc(100dvh - 185px);
  }
}
@media (max-width: 700px){
  #milky-panel{
    width: min(420px, calc(100vw - 24px));
    height: min(620px, calc(100dvh - 125px));
    max-height: calc(100dvh - 125px);
    right:12px;
    bottom:92px;
  }
}


/* MKweb 89 — Milky thinking pulse */
@keyframes milkyThinkingPulse {
  0%   { transform: scale(1); }
  38%  { transform: scale(1.28); }
  68%  { transform: scale(.94); }
  100% { transform: scale(1); }
}
#milkyBtn.milky-thinking,
#milkyFab.milky-thinking,
.milky-fab.milky-thinking,
.milky-launcher.milky-thinking {
  animation: milkyThinkingPulse 2s ease-in-out 1 !important;
  transform-origin: center !important;
}


/* MKweb 90 — 2.5-second blue thinking circle before answer typing */
.milky-thinking-circle-wrap{
  align-self:flex-start;
  min-height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:7px 10px;
}
.milky-thinking-circle{
  display:block;
  width:24px;
  height:24px;
  border-radius:50%;
  background:#2f9bd3;
  transform-origin:center;
  animation:milkyCircleThink 1.25s ease-in-out 2;
}
@keyframes milkyCircleThink{
  0%,100%{transform:scale(1);}
  52%{transform:scale(1.32);}
  76%{transform:scale(.94);}
}
@media (prefers-reduced-motion: reduce){
  .milky-thinking-circle{animation:none;}
}

/* MKweb 91 — slightly smaller Milky thinking circle */
.milky-thinking-circle {
  width: 19px !important;
  height: 19px !important;
}

/* MKweb 92 — tiny additional reduction */
.milky-thinking-circle {
  width: 16px !important;
  height: 16px !important;
}

/* MKweb 93 — mobile Milky keyboard/navigation fix */
@media (max-width: 700px) {
  .milky-panel, .milky-chat, #milkyPanel, #milkyChat {
    position: fixed !important;
    left: 10px !important;
    right: 10px !important;
    top: max(10px, env(safe-area-inset-top)) !important;
    bottom: max(10px, env(safe-area-inset-bottom)) !important;
    width: auto !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
    box-sizing: border-box !important;
    transform: none !important;
    overflow: hidden !important;
    overscroll-behavior: contain !important;
  }
  .milky-messages, #milkyMessages {
    min-height: 0 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain !important;
  }
  .milky-composer, .milky-input-row, #milkyComposer {
    flex: 0 0 auto !important;
    position: relative !important;
    bottom: auto !important;
    padding-bottom: max(10px, env(safe-area-inset-bottom)) !important;
  }
  .milky-composer input, .milky-composer textarea,
  .milky-input-row input, .milky-input-row textarea, #milkyInput {
    font-size: 16px !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
}