/* Benjo-bot assistant widget. Every rule is scoped to .bca so it can't affect the rest of the site. */
.bca {
  --bca-ink: #151515;
  --bca-paper: #ffffff;
  --bca-soft: #f4f1ed;
  --bca-line: #e4e0db;
  --bca-muted: #6b6560;
  --bca-amber: #f0a359;
  --bca-rust: #7c3b08;
  position: fixed;
  right: max(16px, env(safe-area-inset-right));
  bottom: max(16px, env(safe-area-inset-bottom));
  z-index: 9990;
  font-family: "montserrat-regular", "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 15px;
  line-height: 1.55;
  color: var(--bca-ink);
  -webkit-font-smoothing: antialiased;
}
.bca *, .bca *::before, .bca *::after { box-sizing: border-box; }
.bca [hidden] { display: none !important; }

/* Reset button/textarea styles inherited from site themes */
.bca button, .bca textarea {
  margin: 0; font: inherit; color: inherit; letter-spacing: normal; text-transform: none;
  height: auto; line-height: inherit; box-shadow: none; text-shadow: none; min-height: 0;
}
.bca button { cursor: pointer; background: none; border: 0; padding: 0; }
.bca button:focus-visible, .bca a:focus-visible, .bca textarea:focus-visible { outline: 2px solid var(--bca-amber); outline-offset: 2px; }

/* ---------- the pet (full-body character, no button chrome) ---------- */
.bca-launcher {
  display: block; width: 84px; height: 105px !important; padding: 0 !important;
  background: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  filter: drop-shadow(0 0 1.2px rgba(255, 255, 255, 0.95)) drop-shadow(0 6px 10px rgba(0, 0, 0, 0.22));
  touch-action: none; cursor: grab; -webkit-user-select: none; user-select: none;
  transition: transform 0.2s ease;
}
.bca-launcher:hover { transform: scale(1.05); }
.bca-pet { display: block; width: 100%; height: 100%; overflow: visible; }
.bca-shadow { fill: rgba(0, 0, 0, 0.2); transform-box: fill-box; transform-origin: center; animation: bca-shadow 3.2s ease-in-out infinite; }
.bca-metal { fill: #2d2925; }
.bca-metal2 { fill: #3c3630; }
.bca-screen { fill: #0d0c0b; }
.bca-amber { fill: var(--bca-amber); }
.bca-cream { fill: #f4efe6; }
.bca-line { fill: none; stroke: var(--bca-amber); stroke-width: 2.4; stroke-linecap: round; }

.bca-pet-body { animation: bca-bob 3.2s ease-in-out infinite; }
.bca-eyes rect { transform-box: fill-box; transform-origin: center; animation: bca-blink 5s infinite; }
.bca-bulb { animation: bca-glow 2.4s ease-in-out infinite; }
.bca-heart { transform-box: fill-box; transform-origin: center; animation: bca-pulse 2.4s ease-in-out infinite; }
.bca-arm-l, .bca-arm-r { transform-box: fill-box; transform-origin: 50% 12%; }

/* Hover or greeting: wave. Waiting for an answer: look around. Answer arrived: little hop. */
.bca-launcher:hover .bca-arm-r, .bca--wave .bca-arm-r { animation: bca-wave 1.2s ease-in-out 2; }
.bca--thinking .bca-eyes rect { animation: bca-look 1.1s ease-in-out infinite; }
.bca--thinking .bca-bulb { animation: bca-glow 0.5s ease-in-out infinite; }
.bca--hop .bca-pet-body { animation: bca-hop 0.7s ease-out; }
.bca--dragging .bca-launcher { cursor: grabbing; transform: scale(1.08) rotate(-4deg); }
.bca--dragging .bca-pet-body { animation: none; }
.bca--dragging .bca-arm-l, .bca--dragging .bca-arm-r { animation: bca-dangle 0.6s ease-in-out infinite alternate; }
.bca--snap { transition: left 0.28s cubic-bezier(0.2, 0.8, 0.2, 1.2), top 0.28s ease; }

@keyframes bca-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
@keyframes bca-shadow { 0%, 100% { transform: scaleX(1); opacity: 1; } 50% { transform: scaleX(0.85); opacity: 0.7; } }
@keyframes bca-blink { 0%, 92%, 100% { transform: scaleY(1); } 95% { transform: scaleY(0.1); } }
@keyframes bca-glow { 0%, 100% { opacity: 1; } 50% { opacity: 0.4; } }
@keyframes bca-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(0.8); } }
@keyframes bca-wave { 0%, 100% { transform: rotate(0); } 25% { transform: rotate(-150deg); } 50% { transform: rotate(-115deg); } 75% { transform: rotate(-150deg); } }
@keyframes bca-look { 0%, 100% { transform: translateX(0); } 30% { transform: translateX(-2.5px); } 70% { transform: translateX(2.5px); } }
@keyframes bca-hop { 0% { transform: translateY(0); } 35% { transform: translateY(-12px); } 65% { transform: translateY(0); } 80% { transform: translateY(-3px); } 100% { transform: translateY(0); } }
@keyframes bca-dangle { from { transform: rotate(-12deg); } to { transform: rotate(12deg); } }
.bca--still *, .bca--still { animation: none !important; transition: none !important; }

/* Animated (Lottie) pet replaces the drawn one when /images/pet/pet.json exists */
.bca-lottie { display: none; width: 100%; height: 100%; }
.bca-lottie svg { display: block; }
.bca--lottie .bca-lottie { display: block; }
.bca--lottie .bca-pet { display: none; }
.bca--lottie.bca--wave .bca-lottie { animation: bca-wiggle 0.6s ease-in-out 3; transform-origin: 50% 100%; }
.bca--lottie.bca--hop .bca-lottie { animation: bca-hop 0.7s ease-out; }
@keyframes bca-wiggle { 0%, 100% { transform: rotate(0); } 25% { transform: rotate(-6deg); } 75% { transform: rotate(6deg); } }

/* Panel-header avatar (head only) */
.bca-head { fill: #2a2622; }
.bca-face { fill: #0d0c0b; }
.bca-smile { fill: none; stroke: var(--bca-amber); stroke-width: 2.2; stroke-linecap: round; }
.bca-antenna { stroke: #8a8178; stroke-width: 2.5; stroke-linecap: round; }
.bca-ear, .bca-body { fill: #3a342e; }
.bca-bot { display: block; width: 100%; height: 100%; padding: 5px; overflow: visible; }
.bca-bot .bca-eyes rect { animation: none; }

/* ---------- status bubble above the pet (like a speech bubble) ---------- */
.bca-teaser {
  position: absolute; right: 0; bottom: 112px; width: max-content; max-width: 250px;
  display: flex; flex-direction: column; gap: 1px;
  padding: 10px 36px 11px 16px; border-radius: 18px;
  background: #2b2b2b; color: #fff; font-size: 13.5px; line-height: 1.35; cursor: pointer;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.25); animation: bca-pop 0.25s ease-out;
}
.bca-teaser strong { font-weight: 700; font-size: 14px; color: #fff; }
.bca-teaser-text { color: rgba(255, 255, 255, 0.65); }
.bca-teaser-x { position: absolute; top: 6px; right: 8px; width: 24px; height: 24px !important; font-size: 18px !important; color: rgba(255, 255, 255, 0.6) !important; }
@keyframes bca-pop { from { opacity: 0; transform: translateY(6px) scale(0.96); } }

/* Panel and bubble follow the pet: left edge and/or top half of the screen */
.bca--left .bca-panel { right: auto; left: 0; }
.bca--left .bca-teaser { right: auto; left: 0; }
.bca--below .bca-panel { bottom: auto; top: 116px; }
.bca--below .bca-teaser { bottom: auto; top: 112px; }

/* ---------- panel ---------- */
.bca-panel {
  position: absolute; right: 0; bottom: 116px;
  width: min(380px, calc(100vw - 32px)); height: min(560px, calc(100vh - 120px), var(--bca-room, 560px));
  display: flex; flex-direction: column; overflow: hidden;
  background: var(--bca-paper); border-radius: 16px;
  box-shadow: 0 18px 60px rgba(0, 0, 0, 0.28); animation: bca-pop 0.2s ease-out;
}
.bca-head-bar { display: flex; align-items: center; gap: 12px; padding: 14px 14px 14px 16px; background: var(--bca-ink); color: #fff; }
.bca-avatar { width: 42px; height: 42px; flex: 0 0 auto; border-radius: 50%; background: #000; border: 2px solid var(--bca-amber); }
.bca-head-bar h2 { margin: 0 !important; padding: 0; font: 700 16px/1.2 inherit; font-family: inherit; color: #fff !important; letter-spacing: 0; text-transform: none; }
.bca-head-bar p { margin: 2px 0 0 !important; padding: 0; font-size: 12px; line-height: 1.3; color: rgba(255, 255, 255, 0.6) !important; }
.bca-close { margin-left: auto !important; width: 36px; height: 36px !important; border-radius: 50%; font-size: 24px !important; color: #fff !important; }
.bca-close:hover { background: rgba(255, 255, 255, 0.12) !important; }

.bca-log { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 10px; background: var(--bca-soft); overscroll-behavior: contain; }
.bca-msg { max-width: 88%; padding: 10px 13px; border-radius: 14px; font-size: 14.5px; word-wrap: break-word; overflow-wrap: anywhere; }
.bca-msg p { margin: 0 0 6px !important; padding: 0; font-size: inherit; line-height: 1.5; color: inherit; }
.bca-msg p:last-child { margin-bottom: 0 !important; }
.bca-msg ul { margin: 4px 0 6px !important; padding-left: 18px !important; list-style: disc; }
.bca-msg li { margin: 2px 0; font-size: inherit; line-height: 1.45; }
.bca-msg a { color: var(--bca-rust) !important; text-decoration: underline; }
.bca-msg code { font-family: ui-monospace, Consolas, monospace; font-size: 0.9em; background: rgba(0, 0, 0, 0.06); padding: 1px 4px; border-radius: 4px; }
.bca-msg strong { font-weight: 700; }
.bca-msg--assistant { align-self: flex-start; background: var(--bca-paper); border: 1px solid var(--bca-line); border-bottom-left-radius: 4px; }
.bca-msg--user { align-self: flex-end; background: var(--bca-ink); color: #fff; border-bottom-right-radius: 4px; white-space: pre-wrap; }

.bca-related { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--bca-line); }
.bca-related > span { width: 100%; font-size: 11.5px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--bca-muted); }
.bca-typing { display: flex; gap: 4px; padding: 14px; }
.bca-typing span { width: 7px; height: 7px; border-radius: 50%; background: #b5aca3; animation: bca-dot 1s infinite; }
.bca-typing span:nth-child(2) { animation-delay: 0.15s; }
.bca-typing span:nth-child(3) { animation-delay: 0.3s; }
@keyframes bca-dot { 0%, 60%, 100% { opacity: 0.3; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } }

.bca-chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 14px 0; background: var(--bca-soft); }
.bca-chip { padding: 7px 11px !important; border: 1px solid var(--bca-line) !important; border-radius: 999px; background: var(--bca-paper) !important; font-size: 13px !important; line-height: 1.3 !important; color: var(--bca-ink) !important; text-align: left; }
.bca-chip:hover { border-color: var(--bca-rust) !important; color: var(--bca-rust) !important; }

.bca-form { display: flex; align-items: flex-end; gap: 8px; padding: 12px 12px 8px; border-top: 1px solid var(--bca-line); background: var(--bca-paper); margin: 0 !important; }
.bca-form textarea {
  flex: 1; min-height: 42px; max-height: 120px; resize: none; width: auto !important;
  padding: 10px 12px !important; border: 1px solid var(--bca-line) !important; border-radius: 12px;
  background: var(--bca-paper) !important; color: var(--bca-ink) !important; font-size: 15px !important; line-height: 1.4 !important;
}
.bca-form textarea:focus { border-color: var(--bca-rust) !important; outline: none; }
.bca-send { width: 42px; height: 42px !important; flex: 0 0 auto; border-radius: 12px; background: var(--bca-ink) !important; display: grid; place-items: center; }
.bca-send svg { width: 18px; height: 18px; fill: var(--bca-amber); }
.bca-send:disabled { opacity: 0.5; cursor: wait; }
.bca-foot { margin: 0 !important; padding: 0 14px 12px; background: var(--bca-paper); font-size: 11.5px; line-height: 1.4; color: var(--bca-muted) !important; }
.bca-foot a { color: var(--bca-rust) !important; }
.bca-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Phones: the panel becomes a bottom sheet */
@media (max-width: 480px) {
  .bca-panel { position: fixed; left: 8px; right: 8px; bottom: 8px; width: auto; height: min(78vh, 600px); }
  .bca--open .bca-launcher, .bca--open .bca-teaser { display: none; }
  .bca-launcher { width: 70px; height: 88px !important; }
}

@media print { .bca { display: none; } }

/* Home page: lift the existing "back to top" button above the assistant */
#go-top { bottom: 104px !important; right: 20px !important; }