.jc-widget {
  position: fixed;
  right: max(20px, env(safe-area-inset-right));
  bottom: calc(82px + env(safe-area-inset-bottom));
  z-index: 999;
  font-family: "Quicksand", "Trebuchet MS", sans-serif;
  color: #362746;
}
.jc-widget *, .jc-widget *::before, .jc-widget *::after { box-sizing: border-box; }
.jc-widget button, .jc-widget input { font: inherit; }
.jc-widget button { cursor: pointer; }
.jc-widget :focus-visible { outline: 3px solid #277bc4; outline-offset: 3px; }
.jc-widget [hidden] { display: none !important; }
.jc-launcher {
  position: relative; display: flex; align-items: center; gap: 9px; margin-left: auto;
  padding: 7px 17px 7px 7px; border: 1px solid rgba(255,255,255,.7); border-radius: 100px;
  color: #fff; background: linear-gradient(125deg,#d41678,#a91479 58%,#71318f);
  box-shadow: 0 12px 30px rgba(159,29,100,.32), 0 3px 8px rgba(78,31,77,.18);
  transition: transform .25s ease, box-shadow .25s ease;
}
.jc-launcher:hover { transform: translateY(-4px); box-shadow: 0 16px 35px rgba(159,29,100,.4); }
.jc-launcher-face { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: rgba(255,255,255,.2); }
.jc-launcher-face svg { width: 46px; height: 46px; animation: jc-bob 3s ease-in-out infinite; }
.jc-launcher-copy { display: grid; text-align: left; line-height: 1.2; }
.jc-launcher-copy small { font-size: 9px; font-weight: 700; letter-spacing: .12em; opacity: .9; }
.jc-launcher-copy strong { margin-top: 3px; font-size: 16px; }
.jc-launcher-spark { position: absolute; top: -7px; right: 3px; color: #f9c84e; font-size: 19px; animation: jc-twinkle 2.5s ease-in-out infinite; }
.jc-panel {
  position: absolute; right: 0; bottom: calc(100% + 13px); display: flex; flex-direction: column;
  width: min(390px, calc(100vw - 48px)); height: min(610px, calc(100vh - 175px)); height: min(610px, calc(100dvh - 175px)); min-height: 310px;
  overflow: hidden; border: 1px solid rgba(216,194,210,.7); border-radius: 24px; background: #fff;
  box-shadow: 0 24px 70px rgba(48,25,54,.24), 0 5px 20px rgba(48,25,54,.1);
  animation: jc-enter .28s ease both;
}
.jc-header {
  position: relative; display: flex; align-items: center; gap: 13px; flex: none; overflow: hidden;
  padding: 18px 48px 18px 17px; color: #fff; background: linear-gradient(125deg,#d2197a,#a51e89 60%,#673d9b);
}
.jc-header::after { content: ""; position: absolute; right: 30px; bottom: -90px; width: 180px; height: 180px; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; box-shadow: 0 0 0 24px rgba(255,255,255,.04), 0 0 0 48px rgba(255,255,255,.03); pointer-events: none; }
.jc-header-art { position: relative; display: grid; place-items: center; width: 66px; height: 66px; flex: none; border: 1px solid rgba(255,255,255,.35); border-radius: 21px; background: rgba(255,255,255,.14); }
.jc-header-art svg { width: 58px; height: 58px; animation: jc-bob 3s ease-in-out infinite; }
.jc-eyes { transform-origin: center; animation: jc-blink 5s infinite; }
.jc-spark { position: absolute; color: #ffe084; animation: jc-twinkle 2s ease-in-out infinite; }
.jc-spark-one { top: -6px; right: -5px; font-size: 18px; }
.jc-spark-two { bottom: 0; left: -6px; font-size: 13px; animation-delay: 1s; }
.jc-heading { position: relative; z-index: 1; min-width: 0; }
.jc-eyebrow { font-size: 9px; font-weight: 700; letter-spacing: .16em; color: #ffdfef; }
.jc-heading h2 { margin: 4px 0 2px; color: #fff; font-family: "Baloo 2", "Trebuchet MS", sans-serif; font-size: 23px; line-height: 1.05; font-weight: 800; }
.jc-heading p { margin: 0; color: #fff; font-size: 12px; opacity: .9; }
.jc-close { position: absolute; z-index: 2; top: 13px; right: 13px; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; border-radius: 50%; background: rgba(255,255,255,.17); color: #fff; font-size: 24px; line-height: 1; }
.jc-close:hover { background: rgba(255,255,255,.3); }
.jc-conversation { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 16px; background: linear-gradient(180deg,#fff8fc,#fffdfb); }
.jc-intro { margin: 0 0 14px; color: #976c86; font-size: 9px; font-weight: 700; letter-spacing: .12em; text-align: center; }
.jc-intro span { color: #e2a62a; }
.jc-message { display: flex; align-items: flex-end; gap: 8px; margin-bottom: 12px; animation: jc-message .25s ease both; }
.jc-message--user { justify-content: flex-end; }
.jc-avatar { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: 12px; background: #d72e88; }
.jc-avatar svg { width: 29px; height: 29px; }
.jc-bubble { max-width: 88%; padding: 12px 14px; border: 1px solid #f1e4ec; border-radius: 17px 17px 17px 5px; color: #46354a; background: #fff; box-shadow: 0 3px 12px rgba(83,48,70,.05); font-size: 13px; font-weight: 500; line-height: 1.55; overflow-wrap: anywhere; }
.jc-bubble p { margin: 0; }
.jc-message--user .jc-bubble { border: 0; border-radius: 17px 17px 5px 17px; color: #fff; background: #b51a76; }
.jc-answer-links { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }
.jc-answer-links a { display: inline-block; padding: 6px 9px; border-radius: 9px; background: #fff0f7; color: #a20c62; font-size: 12px; font-weight: 700; text-decoration: none; }
.jc-answer-links a:hover { background: #fbd8eb; text-decoration: underline; }
.jc-typing { display: flex; gap: 4px; width: fit-content; margin: 0 0 12px 40px; padding: 12px; border-radius: 14px; background: #f4e7ef; }
.jc-typing span { width: 5px; height: 5px; border-radius: 50%; background: #b45b8b; animation: jc-bounce 1s infinite; }
.jc-typing span:nth-child(2) { animation-delay: .15s; }.jc-typing span:nth-child(3) { animation-delay: .3s; }
.jc-topics { flex: none; padding: 10px 15px 11px; border-top: 1px solid #f4ebf0; background: #fff; }
.jc-topics p { margin: 0 0 7px; color: #806b7a; font-size: 9px; font-weight: 700; letter-spacing: .12em; }
.jc-chips { display: flex; gap: 6px; overflow-x: auto; padding: 2px 2px 5px; scrollbar-width: thin; }
.jc-chip { flex: none; padding: 7px 10px; border: 1px solid #f1d9e8; border-radius: 100px; color: #8d175a; background: #fff8fc; font-size: 11px !important; font-weight: 700 !important; white-space: nowrap; }
.jc-chip:hover { background: #fce8f3; border-color: #eaaed0; }
.jc-form { display: flex; flex: none; align-items: center; gap: 8px; padding: 0 14px 9px; background: #fff; }
.jc-form input { width: 100%; min-width: 0; height: 43px; padding: 0 13px; border: 1px solid #e8dce4; border-radius: 13px; outline-offset: -2px; background: #faf8fa; color: #362746; font-size: 13px; }
.jc-form input::placeholder { color: #8c7c88; }
.jc-form button { display: grid; place-items: center; flex: none; width: 43px; height: 43px; padding: 10px; border: 0; border-radius: 13px; color: #fff; background: #b51a76; }
.jc-form button:hover { background: #8d135f; }
.jc-form button svg { width: 23px; height: 23px; }
.jc-footer { flex: none; padding: 0 10px 11px; color: #776873; background: #fff; text-align: center; font-size: 10px; }
.jc-footer span { margin: 0 3px; color: #d3a6bf; }
.jc-footer a { color: #a20c62; font-weight: 700; text-decoration: none; }
.jc-footer a:hover { text-decoration: underline; }
.jc-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
@keyframes jc-enter { from { opacity: 0; transform: translateY(10px) scale(.97); } to { opacity: 1; transform: none; } }
@keyframes jc-message { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes jc-bob { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
@keyframes jc-twinkle { 0%,100% { opacity: .65; transform: scale(.8) rotate(-10deg); } 50% { opacity: 1; transform: scale(1.15) rotate(10deg); } }
@keyframes jc-blink { 0%,45%,49%,100% { transform: scaleY(1); } 47% { transform: scaleY(.1); } }
@keyframes jc-bounce { 0%,60%,100% { transform: translateY(0); } 30% { transform: translateY(-4px); } }
@media (max-width: 480px) {
  .jc-widget { right: max(12px, env(safe-area-inset-right)); bottom: calc(76px + env(safe-area-inset-bottom)); }
  .jc-panel { width: min(390px, calc(100vw - 48px)); height: min(560px, calc(100dvh - 160px)); }
  .jc-launcher-face { width: 46px; height: 46px; }.jc-launcher-face svg { width: 41px; height: 41px; }
}
@media (max-height: 480px) {
  .jc-panel { position: fixed; top: 8px; right: 8px; bottom: 8px; width: min(390px, calc(100vw - 48px)); height: auto; min-height: 0; }
  .jc-header { padding-top: 9px; padding-bottom: 9px; }.jc-header-art { width: 48px; height: 48px; }.jc-header-art svg { width: 44px; height: 44px; }
}
@media (prefers-reduced-motion: reduce) {
  .jc-widget *, .jc-widget *::before, .jc-widget *::after { animation: none !important; transition: none !important; }
}
