/* "Ask Leo" chat page (Liza, 2026-10-28). Mobile first; dark site, white bubbles for Leo, grey for the visitor. */
body.public-site .public-page-hero--center .public-title { text-align: center; }
body.public-site .ask { --ask-field: #ededed; --ask-field-2: #dedede; --ask-go: #16a34a; --ask-go-hover: #15803d;
  --ask-leo: #ffffff;
  --ask-leo-ink: #141414;
  --ask-me: #262626;
  --ask-me-ink: #f6f6f6;
  position: relative;
  max-width: 600px;
  margin: 0 auto;
  padding: 1.25rem 1rem 1.5rem;
  border-radius: 28px;
  background:
    radial-gradient(120% 60% at 50% 0%, rgba(214, 170, 160, 0.16), transparent 70%),
    radial-gradient(90% 50% at 50% 100%, rgba(255, 255, 255, 0.05), transparent 70%),
    #171717;
  border: 1px solid var(--public-line);
}
body.public-site .ask-thread { display: flex; flex-direction: column; gap: 0.6rem; min-height: 9rem; }
body.public-site .ask-msg { display: flex; align-items: flex-end; gap: 0.6rem; max-width: 86%; animation: ask-pop 0.32s cubic-bezier(0.2, 0.8, 0.2, 1) both; }
body.public-site .ask-msg--leo { align-self: flex-start; }
body.public-site .ask-msg--me { align-self: flex-end; flex-direction: row-reverse; }
body.public-site .ask-avatar { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex: none; }
body.public-site .ask-bubble {
  padding: 0.7rem 1rem;
  border-radius: 20px 20px 20px 6px;
  background: var(--ask-leo);
  color: var(--ask-leo-ink);
  font-size: 1rem;
  line-height: 1.45;
  letter-spacing: -0.005em;
  white-space: pre-line;
  overflow-wrap: anywhere;
}
body.public-site .ask-msg--me .ask-bubble { border-radius: 20px 20px 6px 20px; background: var(--ask-me); color: var(--ask-me-ink); border: 1px solid rgba(255, 255, 255, 0.12); }
body.public-site .ask-error { color: #c0392b; }
body.public-site .ask-msg--me .ask-error { color: #ffb4a8; }

/* typing dots */
body.public-site .ask-typing { display: inline-flex; gap: 4px; align-items: center; height: 1.2rem; }
body.public-site .ask-typing i { width: 7px; height: 7px; border-radius: 50%; background: #9a9a9a; animation: ask-dot 1s infinite ease-in-out; }
body.public-site .ask-typing i:nth-child(2) { animation-delay: 0.15s; }
body.public-site .ask-typing i:nth-child(3) { animation-delay: 0.3s; }

/* quick choices under a bubble */
body.public-site .ask-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; padding-left: 2.85rem; animation: ask-pop 0.32s 0.05s cubic-bezier(0.2, 0.8, 0.2, 1) both; }
body.public-site .ask-actions .public-pill { cursor: pointer; }
body.public-site .ask-platforms { padding-left: 2.85rem; animation: ask-pop 0.32s 0.05s cubic-bezier(0.2, 0.8, 0.2, 1) both; }
body.public-site .ask-platforms .ask-label { margin-bottom: 0.4rem; }
body.public-site .ask-platforms .public-pills { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0; }
body.public-site .ask-actions .public-pill-solid { margin-top: 0; }

/* the form: plain stack without JS, one step at a time with it */
body.public-site .ask-form { display: flex; flex-direction: column; gap: 1rem; margin-top: 1.25rem; }
body.public-site .ask-step { margin: 0; padding: 0; border: 0; min-width: 0; }
body.public-site .ask-step[hidden] { display: none; }
body.public-site .ask-label { display: block; margin: 0 0 0.5rem; font-size: 0.72rem; font-weight: 500; letter-spacing: 0.16em; text-transform: uppercase; color: var(--public-muted); }
body.public-site .ask-composer { display: flex; align-items: flex-end; gap: 0.5rem; padding: 0.4rem 0.4rem 0.4rem 1rem; border-radius: 24px; background: var(--ask-field); border: 1px solid var(--ask-field); }
body.public-site .ask-composer:focus-within { box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.22); }
/* !important beats brand-minimal's global dark-input rule (body.public-site textarea { background:#1a1a1a !important; … }) */
body.public-site .ask-composer textarea:not(#_):not(#_) {
  flex: 1; min-width: 0; min-height: 2.6rem; max-height: 10rem; margin: 0; resize: none; font: inherit; font-size: 1rem; line-height: 1.45;
  padding: 0.55rem 0 !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  background: transparent !important; color: #141414 !important;
}
body.public-site .ask-composer textarea:not(#_):not(#_):focus { outline: none !important; box-shadow: none !important; }
body.public-site .ask-composer textarea:not(#_):not(#_)::placeholder { color: #8a8a8a !important; }
body.public-site .ask-composer textarea.is-shake { animation: ask-shake 0.35s; }
body.public-site .ask-send {
  flex: none; width: 2.6rem; height: 2.6rem; border-radius: 50%; border: 0; background: var(--ask-go); color: #fff;
  display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: transform 0.15s ease;
}
body.public-site .ask-send:hover { transform: scale(1.06); background: var(--ask-go-hover); }
body.public-site .ask-send:active { transform: scale(0.94); }
body.public-site .ask-count { margin: 0.4rem 0 0 1rem; font-size: 0.7rem; color: var(--public-muted); letter-spacing: 0.06em; }
body.public-site .ask-choices { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; margin-bottom: 0.75rem; }
body.public-site .ask-choice { display: inline-flex; align-items: center; gap: 0.45rem; font-size: 0.95rem; }
body.public-site .ask-fields { display: flex; flex-direction: column; gap: 0.6rem; }
/* white pills like the composer; !important beats brand-minimal's global input rule */
body.public-site .ask-input:not(#_):not(#_) {
  width: 100%; box-sizing: border-box; font: inherit; font-size: 1rem;
  padding: 0.8rem 1.1rem !important; border-radius: 9999px !important; border: 1px solid var(--ask-field) !important; box-shadow: none !important;
  background: var(--ask-field) !important; color: #141414 !important;
}
body.public-site .ask-input:not(#_):not(#_):focus { outline: none !important; box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.22) !important; }
body.public-site .ask-input:not(#_):not(#_)::placeholder { color: #8a8a8a !important; }
/* network + @handle in one white pill */
body.public-site .ask-handle { display: flex; align-items: center; background: var(--ask-field); border-radius: 9999px; padding-left: 0.35rem; }
body.public-site .ask-handle:focus-within { box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.22); }
body.public-site .ask-handle select:not(#_):not(#_) { flex: none; appearance: auto; -webkit-appearance: menulist; border: 0 !important; background: var(--ask-field-2) !important; color: #141414 !important; border-radius: 9999px !important; padding: 0.45rem 0.6rem !important; font: inherit; font-size: 0.9rem; box-shadow: none !important; min-height: 0; }
body.public-site .ask-handle-at { padding: 0 0 0 0.7rem; color: #141414; font-size: 1rem; }
body.public-site .ask-input--handle:not(#_):not(#_) { flex: 1; min-width: 0; padding-left: 0.2rem !important; }
body.public-site .ask-handle .ask-input--handle:not(#_):not(#_):focus { box-shadow: none !important; }

body.public-site .ask-continue, body.public-site .ask-submit { align-self: flex-start; cursor: pointer; margin-top: 0.25rem; }
body.public-site :is(.ask-continue, .ask-submit).public-pill-solid:not(#_):not(#_) { background: var(--ask-go); border-color: var(--ask-go); color: #fff; }
body.public-site :is(.ask-continue, .ask-submit).public-pill-solid:not(#_):not(#_):hover { background: var(--ask-go-hover); border-color: var(--ask-go-hover); }
body.public-site .ask.is-js .ask-fields { padding-left: 0; }
body.public-site .ask.is-js .ask-continue { align-self: flex-end; }
body.public-site .ask-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* hero pill */
body.public-site .public-hero-copy .public-pill-ask { margin-top: 1rem; margin-left: 0.4rem; }

@keyframes ask-pop { from { opacity: 0; transform: translateY(10px) scale(0.98); } to { opacity: 1; transform: none; } }
@keyframes ask-dot { 0%, 80%, 100% { transform: translateY(0); opacity: 0.5; } 40% { transform: translateY(-4px); opacity: 1; } }
@keyframes ask-shake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }

@media (min-width: 640px) {
  body.public-site .ask { padding: 1.75rem 1.5rem 2rem; }
  body.public-site .ask-bubble { font-size: 1.05rem; }
}

@media (prefers-reduced-motion: reduce) {
  body.public-site .ask-msg, body.public-site .ask-actions, body.public-site .ask-typing i,
  body.public-site .ask-composer textarea.is-shake { animation: none; }
  body.public-site .ask-send { transition: none; }
}

body.public-site .ask [hidden] { display: none !important; }

/* "Ask another" sits apart from the platform pills: own line, right side, like a reply */
body.public-site .ask-platforms + .ask-actions { justify-content: flex-end; padding-left: 0; margin-top: 0.9rem; }