#website-ava {
  --wa-paper: #fffdf8;
  --wa-ink: #23221f;
  --wa-muted: #645f55;
  --wa-rule: #dcd1be;
  --wa-gold: #b49a62;
  --wa-edge: 14px;
  --wa-size: 54px;
  --wa-offset: calc(var(--wa-size) + 10px);
  --wa-left: max(var(--wa-edge), env(safe-area-inset-left));
  --wa-right: max(var(--wa-edge), env(safe-area-inset-right));
  --wa-top: max(var(--wa-edge), env(safe-area-inset-top));
  --wa-bottom: max(var(--wa-edge), env(safe-area-inset-bottom));
  color-scheme: light;
  color: var(--wa-ink);
  font: 15px/1.55 Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
}
#website-ava * { box-sizing: border-box; }
#website-ava [hidden] { display: none !important; }
#website-ava button { margin: 0; font: inherit; cursor: pointer; }
#website-ava button:disabled { cursor: default; opacity: .6; }
#website-ava :focus-visible { outline: 2px solid #856a34; outline-offset: 3px; }

#website-ava .wa-launch {
  position: fixed; z-index: 990; display: grid; place-items: center;
  width: var(--wa-size); height: var(--wa-size); padding: 0;
  border: 1px solid var(--wa-gold); border-radius: 50%;
  background: radial-gradient(ellipse at 36% 25%, #e5d6ef, #ceb8dd 66%, #bea1d0);
  box-shadow: inset 0 0 0 3px #d4c0e1, inset 0 0 0 4px #b5a19f, 0 4px 13px #201b142b;
  touch-action: none; user-select: none;
  transition: box-shadow .16s ease;
}
#website-ava .wa-launch:hover,
#website-ava[data-talking="true"] .wa-launch {
  box-shadow: inset 0 0 0 3px #d4c0e1, inset 0 0 0 4px #a3936f, 0 4px 15px #201b143d;
}
#website-ava .wa-launch img { display: block; width: 37px; height: 37px; max-width: none; pointer-events: none; }
#website-ava[data-dragging] .wa-launch { z-index: 992; cursor: grabbing; }
#website-ava[data-dragging] .wa-call-status { visibility: hidden; }

#website-ava[data-corner$="left"] :is(.wa-launch, #wa-chat) { left: var(--wa-left); right: auto; }
#website-ava[data-corner$="right"] :is(.wa-launch, #wa-chat) { right: var(--wa-right); left: auto; }
#website-ava[data-corner^="top"] .wa-launch { top: var(--wa-top); bottom: auto; }
#website-ava[data-corner^="bottom"] .wa-launch { bottom: var(--wa-bottom); top: auto; }
#website-ava[data-corner^="top"] #wa-chat { top: calc(var(--wa-top) + var(--wa-offset)); bottom: auto; }
#website-ava[data-corner^="bottom"] #wa-chat { bottom: calc(var(--wa-bottom) + var(--wa-offset)); top: auto; }

#website-ava .wa-call-status {
  position: fixed; z-index: 990; margin: 0; padding: 6px 10px; pointer-events: none;
  max-width: min(20rem, calc(100vw - var(--wa-left) - var(--wa-right) - var(--wa-offset)));
  overflow-wrap: anywhere; border: 1px solid var(--wa-rule); border-radius: 5px; background: var(--wa-paper);
  box-shadow: 0 2px 7px #201b1412; color: var(--wa-ink); font: inherit; font-size: 13px; line-height: 1.4;
}
#website-ava[data-corner$="left"] .wa-call-status { left: calc(var(--wa-left) + var(--wa-offset)); }
#website-ava[data-corner$="right"] .wa-call-status { right: calc(var(--wa-right) + var(--wa-offset)); }
#website-ava[data-corner^="top"] .wa-call-status { top: calc(var(--wa-top) + 5px); }
#website-ava[data-corner^="bottom"] .wa-call-status { bottom: calc(var(--wa-bottom) + 5px); }
#website-ava .wa-call-status:empty { display: none; }

#wa-chat {
  position: fixed; z-index: 991; display: flex; flex-direction: column;
  width: min(368px, calc(100vw - var(--wa-left) - var(--wa-right)));
  max-height: calc(100vh - var(--wa-offset) - var(--wa-top) - var(--wa-bottom));
  max-height: calc(100dvh - var(--wa-offset) - var(--wa-top) - var(--wa-bottom));
  overflow-y: auto; overscroll-behavior: contain; padding: 0; text-align: left;
  background: var(--wa-paper); color: var(--wa-ink); border: 1px solid var(--wa-rule); border-radius: 10px;
  box-shadow: 0 10px 36px #28231b26, 0 1px 3px #28231b14;
}
#wa-chat header {
  position: static; display: flex; flex: none; align-items: center; justify-content: space-between;
  gap: 12px; padding: 14px 18px; margin: 0; border-bottom: 1px solid var(--wa-rule);
  background: var(--wa-paper); color: var(--wa-ink); box-shadow: none;
}
#wa-chat h2 { margin: 0; color: inherit; font: normal 27px/1.1 Georgia, "Times New Roman", serif; letter-spacing: -.035em; }
#wa-chat header p { margin: 0 0 3px; font: inherit; font-size: 12px; color: var(--wa-muted); }
#wa-chat .wa-close {
  min-width: 42px; min-height: 42px; padding: 0; border: 0; border-radius: 5px;
  background: transparent; color: var(--wa-muted); font-size: 22px; line-height: 1;
}
#wa-chat .wa-close:hover { background: #f3ede2; color: var(--wa-ink); }
#wa-chat .wa-transcript {
  flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; min-height: 54px;
  max-height: 300px; max-height: min(36dvh, 300px); padding: 15px 18px;
}
#wa-chat .wa-greeting, #wa-chat .wa-turn { margin: 0; color: var(--wa-ink); font: inherit; overflow-wrap: anywhere; }
#wa-chat .wa-turn + .wa-turn, #wa-chat .wa-greeting + .wa-turn { margin-top: 12px; }
#wa-chat .wa-turn strong { display: block; color: var(--wa-muted); font-size: 12px; line-height: 1.4; font-weight: 600; }
#wa-chat .wa-turn p { margin: 2px 0 0; color: inherit; font: inherit; white-space: pre-wrap; }
#wa-chat a { color: #6d532b; text-decoration: underline; text-underline-offset: 2px; }
#wa-chat .wa-turn a { display: block; margin-top: 4px; }

#wa-chat form { flex: none; display: block; padding: 13px 18px; margin: 0; border-top: 1px solid var(--wa-rule); }
#wa-chat label { display: block; margin: 0 0 5px; color: var(--wa-muted); font-size: 13px; font-weight: 600; }
#wa-chat textarea, #wa-chat input[type="text"] {
  display: block; width: 100%; padding: 9px 11px; margin: 0;
  color: var(--wa-ink); background: #fffefb; border: 1px solid #b9ae9b; border-radius: 5px;
  font: inherit; font-size: 16px; line-height: 1.4;
}
#wa-chat textarea { min-height: 48px; max-height: 110px; resize: vertical; }
#wa-chat .wa-actions { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:8px; }
#wa-chat .wa-speak { display:inline-flex; align-items:center; gap:6px; min-height:42px; padding:5px 0; background:transparent; color:var(--wa-ink); border:0; font-size:14px; }
#wa-chat .wa-speak:hover { text-decoration:underline; text-underline-offset:3px; }
#wa-chat .wa-send {
  display: block; min-height: 42px; margin: 0 0 0 auto; padding: 8px 17px; border: 1px solid var(--wa-ink);
  border-radius: 5px; color: var(--wa-paper); background: var(--wa-ink); font-weight: 600; font-size: 14px;
}
#wa-chat .wa-send:hover:not(:disabled) { background: #403d34; }
#wa-chat .wa-status { margin: 0; padding: 0 18px 12px; color: var(--wa-muted); font-size: 13px; line-height: 1.4; }
#wa-chat .wa-status:empty { padding: 0; }

@media (max-width: 460px), (max-height: 480px) {
  #website-ava { --wa-edge: 8px; --wa-offset: calc(var(--wa-size) + 6px); }
}
@media (prefers-reduced-motion: reduce) {
  #website-ava .wa-launch { transition: none; }
}

#website-ava .wa-call-status a { pointer-events: auto; color: var(--wa-ink); text-underline-offset: .2em; }

#website-ava .wa-call-icon { display:none; position:absolute; width:24px; height:24px; top:50%; transform:translateY(-50%); color:#54415c; pointer-events:none; }
#website-ava[data-talking="true"] .wa-call-icon { display:block; }
#website-ava[data-corner$="left"] .wa-call-icon { left:calc(100% + 6px); }
#website-ava[data-corner$="right"] .wa-call-icon { right:calc(100% + 6px); }
#website-ava[data-talking="true"] .wa-call-status { --wa-offset:calc(var(--wa-size) + 36px); }
@keyframes wa-speaking { from { opacity:.35; } to { opacity:1; } }
@media (prefers-reduced-motion:no-preference) {
  #website-ava[data-speaking="true"] .wa-sound-waves { animation:wa-speaking .65s ease-in-out infinite alternate; }
}
