:root{
  --ouro-escuro:#A9761F;
  --ouro:#C79338;
  --ouro-claro:#E9C87C;
  --ouro-luz:#F6E4BD;
  --tinta:#20303E;
  --tinta-media:#5D6E7C;
  --tinta-fraca:#93A2AE;
  --areia:#FBF8F2;
  --azul: #204f5e;

  --vidro:linear-gradient(158deg,rgba(255,255,255,.86),rgba(255,255,255,.62));
  --vidro-borda:1px solid rgba(255,255,255,.85);
  --vidro-fio:inset 0 0 0 1px rgba(199,147,56,.16);
  --vidro-sombra:0 24px 60px -28px rgba(32,48,62,.35), 0 2px 8px -4px rgba(169,118,31,.18);

  --primary:#204f5e;
  --primary-dark:#143844;
  --accent:#5a8695;
  --gold:#C79338;
  --gold-dark:#A9761F;
  --bg:#FBF8F2;
  --border:#e3e8ec;
  --text:#20303E;
  --muted:#93A2AE;
  --success:#28a745;
  --danger:#d9534f;
}

/* ---------- 2. base ---------- */
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;font-family:"Outfit",system-ui,sans-serif;color:var(--tinta);
  background:var(--areia);-webkit-font-smoothing:antialiased;overflow:hidden}

.abertura h2,
.inicio h3 {
  color: var(--azul);
}

/* ---------- 3. cenario ---------- */
.cenario{position:fixed;inset:0;z-index:0;overflow:hidden;
  background:radial-gradient(120% 80% at 50% 0%,#FFFDF8 0%,#F7F1E6 42%,#EDF2F6 100%);
  background-size:140% 140%;animation:fundo-passeio 24s ease-in-out infinite alternate}
.cenario span{position:absolute;display:block;border-radius:50%;filter:blur(70px);opacity:.62}
.b1{width:26vw;height:26vw;left:-12vw;top:-18vw;background:radial-gradient(circle,#F5CE86,#F5CE8600);animation:mancha-um 20s ease-in-out infinite alternate}
.b2{width:22vw;height:22vw;right:-10vw;top:6vh;background:radial-gradient(circle,#C79338,#C7933800);opacity:.34;animation:mancha-dois 20s ease-in-out infinite alternate}
.b3{width:60vw;height:30vw;left:22vw;bottom:-24vw;background:radial-gradient(circle,#BBD3E4,#BBD3E400);opacity:.5;animation:mancha-tres 20s ease-in-out infinite alternate}
.grade{position:absolute;inset:0;opacity:.35;
  background-image:linear-gradient(rgba(32,48,62,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(32,48,62,.045) 1px,transparent 1px);
  background-size:88px 88px;
  -webkit-mask-image:radial-gradient(75% 60% at 50% 40%,#000,transparent);
  mask-image:radial-gradient(75% 60% at 50% 40%,#000,transparent)}

/* ---------- 4. topo ---------- */
.topo{position:relative;z-index:3;display:flex;align-items:center;gap:14px;padding:13px 22px;
  background:linear-gradient(180deg,rgba(255,255,255,.8),rgba(255,255,255,.42));
  backdrop-filter:blur(22px) saturate(150%);-webkit-backdrop-filter:blur(22px) saturate(150%);
  border-bottom:1px solid rgba(199,147,56,.16)}
.marca{display:flex;align-items:center;gap:11px}
.marca h1{font-size:16px;font-weight:600;letter-spacing:-.01em;margin:0;line-height:1.15}
.marca p{margin:1px 0 0;font-size:12px;color:var(--tinta-fraca)}
.direita{margin-left:auto;display:flex;gap:8px}
.btn-fantasma{display:inline-flex;align-items:center;gap:7px;font:inherit;font-size:13px;color:var(--tinta-media);
  background:rgba(255,255,255,.6);border:1px solid rgba(199,147,56,.22);padding:9px 14px;border-radius:999px;
  cursor:pointer;transition:.18s;text-decoration:none}
.btn-fantasma:hover{color:var(--ouro-escuro);border-color:rgba(199,147,56,.5);background:#fff}

/* ---------- 5. palco ---------- */
.palco{position:relative;z-index:1;height:calc(100dvh - 65px);display:flex;flex-direction:column;
  align-items:center;padding:18px 22px 20px;gap:14px}
.fluxo{flex:1;width:100%;min-height:0;display:flex}
/* A trilha e quem rola: o JS le scrollTop/scrollHeight deste elemento. */
.trilha{flex:1;max-width:780px;margin:0 auto;overflow-y:auto;scroll-behavior:smooth;
  padding:6px 2px;display:flex;flex-direction:column;gap:20px}
.trilha::-webkit-scrollbar{width: 0;}
.trilha::-webkit-scrollbar-thumb{background:rgba(32,48,62,.14);border-radius:99px}

/* ---------- 6. abertura ---------- */
.abertura{padding:34px 4px 4px;text-align:center}
/* logo do cliente; cai no desenho de reserva quando a imagem nao carrega */
.logo{position:relative;display:grid;place-items:center;flex:none}
.logo img{width:100%;height:100%;object-fit:contain}
.logo.av img {width:60%;aspect-ratio: 1/1;object-fit:contain; }
.logo .reserva{display:none;width:100%;height:100%;border-radius:50%;align-items:center;justify-content:center;
  font-family:"Outfit",sans-serif;font-weight:500;color:#fff;letter-spacing:.06em;line-height:1;
  background:linear-gradient(148deg,var(--ouro),var(--ouro-escuro));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 10px 22px -14px rgba(169,118,31,.9)}
.logo.sem-imagem .reserva{display:flex}
.logo-topo .reserva{font-size:15px}
.logo.av .reserva{font-size:12px}
.logo-grande .reserva{font-size:32px}
.logo.sem-imagem img{display:none}

.logo-topo{width:44px;height:44px}
.logo.av{width:32px;height:32px;margin-top:3px}

.selo-grande{position:relative;width:136px;height:136px;margin:0 auto 20px;display:grid;place-items:center;
  animation:flutua 6s ease-in-out infinite}
.selo-grande::before,
.logo.av::before {content:"";position:absolute;inset:0;border-radius:50%;opacity: .6;
  background:radial-gradient(circle at 50% 45%,rgba(255,255,255,.95),rgba(255,255,255,.55) 58%,rgba(255,255,255,0) 72%);
  box-shadow:0 26px 54px -30px rgba(169,118,31,.9),inset 0 0 0 1px rgba(199,147,56,.18);
  backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%)}
.selo-grande::after{content:"";position:absolute;inset:-16px;border-radius:50%;z-index:-1;display: none;
  background:radial-gradient(circle,rgba(233,200,124,.55),rgba(233,200,124,0) 68%)}
.logo-grande{position:relative;width:88px;height:88px}
.abertura h2{font-family:"Outfit",sans-serif;font-weight:400;
  font-size:40px;line-height:1.1;letter-spacing:-.015em;margin:0 0 10px}
.abertura>p{margin:0 auto;max-width:46ch;font-size:15px;line-height:1.6;color:var(--tinta-media)}

.inicios{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:26px}
.inicio{font:inherit;cursor:pointer;padding:20px 16px;border-radius:18px;text-align:center;
  display:flex;flex-direction:column;justify-content:center;align-items:center;gap:2px;
  background:rgba(255,255,255,.7);border:1px solid rgba(255,255,255,.9);
  box-shadow:0 16px 34px -26px rgba(32,48,62,.6),inset 0 0 0 1px rgba(199,147,56,.13);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transition:.2s}
.inicio:hover{background:#fff;transform:translateY(-2px);box-shadow:0 22px 38px -24px rgba(32,48,62,.5),inset 0 0 0 1px rgba(199,147,56,.4)}
.inicio .ic{width:48px;height:auto;aspect-ratio:1/1;border-radius:50%;display:grid;place-items:center;
  margin-bottom:11px;background:rgba(199,147,56,.12);color:var(--ouro-escuro)}
.ic svg{width:50%;height:auto;object-fit:contain;aspect-ratio:1/1}
.inicio h3{margin:0 0 4px;font-size:14px;font-weight:600;letter-spacing:-.01em}
.inicio p{margin:0;font-size:12.5px;line-height:1.5;color:var(--tinta-fraca);max-width:24ch}

/* ---------- 7. baloes ---------- */
.msg{display:flex;gap:12px;animation:sobe .45s cubic-bezier(.2,.7,.3,1) both}
.msg .av{width:64px;height:64px;flex:none;margin-top:2px}
.bolha{padding:14px 18px;border-radius:20px;font-size:15px;line-height:1.62;max-width:min(620px,88%)}
.de-teo .bolha{background:var(--vidro);backdrop-filter:blur(24px) saturate(160%);
  -webkit-backdrop-filter:blur(24px) saturate(160%);border:var(--vidro-borda);
  box-shadow:var(--vidro-sombra),var(--vidro-fio);border-top-left-radius:6px}
.de-voce{justify-content:flex-end}
.de-voce .bolha{color:#fff;border-top-right-radius:6px;
  background:linear-gradient(140deg,var(--ouro),var(--ouro-escuro));
  box-shadow:0 18px 34px -22px rgba(169,118,31,1),inset 0 1px 0 rgba(255,255,255,.3)}
.bolha p{margin:0}
.bolha p+p{margin-top:10px}
.bolha b{font-weight:600}
.pontos{display:flex;gap:5px;padding:4px 2px}
.pontos i{width:7px;height:7px;border-radius:50%;background:var(--ouro);opacity:.45;animation:pulsa 1.3s infinite}
.pontos i:nth-child(2){animation-delay:.18s}
.pontos i:nth-child(3){animation-delay:.36s}

/* ---------- 8. area de comando ---------- */
.comando{width:100%;max-width:780px;display:flex;flex-direction:column;gap:11px}
.escrita{background:var(--vidro);backdrop-filter:blur(28px) saturate(160%);
  -webkit-backdrop-filter:blur(28px) saturate(160%);border:var(--vidro-borda);border-radius:24px;
  box-shadow:var(--vidro-sombra),var(--vidro-fio);padding:8px 8px 8px 20px;
  display:flex;align-items:flex-end;gap:10px;transition:.2s}
.escrita:focus-within{box-shadow:0 26px 60px -28px rgba(32,48,62,.4),inset 0 0 0 1.5px rgba(199,147,56,.55)}
.escrita textarea{flex:1;border:0;background:transparent;resize:none;font:inherit;font-size:15px;
  color:var(--tinta);line-height:1.5;padding:14px 0;max-height:130px;outline:0;font-family:"Outfit",sans-serif}
.escrita textarea::placeholder{color:var(--tinta-fraca)}
.enviar{width:44px;height:44px;flex:none;border:0;border-radius:15px;cursor:pointer;display:grid;place-items:center;color:#fff;
  background:linear-gradient(140deg,var(--ouro-claro),var(--ouro) 48%,var(--ouro-escuro));
  box-shadow:0 12px 24px -12px rgba(169,118,31,.95),inset 0 1px 0 rgba(255,255,255,.45);transition:.18s}
.enviar:hover{transform:translateY(-1px);filter:brightness(1.05)}
/* O botao enviar nasce desabilitado (campo vazio) — mantem o peso visual */
.enviar:disabled{opacity:.5;cursor:default}
.enviar:disabled:hover{transform:none;filter:none}
.rodape{text-align:center;font-size:11.5px;color:var(--tinta-fraca);margin:0}

/* botao de limpar conversa, ao lado do enviar */
.limpar-conversa{width:44px;height:44px;flex:none;border:1px solid rgba(199,147,56,.22);border-radius:15px;
  cursor:pointer;display:grid;place-items:center;color:var(--tinta-media);background:rgba(255,255,255,.6);
  transition:.18s;font-size:20px}
.limpar-conversa:hover{color:var(--ouro-escuro);border-color:rgba(199,147,56,.5);background:#fff}
.limpar-conversa:active{transform:scale(.96)}

/* ---------- 9. animacoes e acessibilidade ---------- */
@keyframes fundo-passeio{0%{background-position:28% 0}50%{background-position:72% 24%}100%{background-position:38% 12%}}
@keyframes mancha-um{0%{transform:translate(-2vw,-1vh) scale(1)}35%{transform:translate(22vw,16vh) scale(1.08)}70%{transform:translate(42vw,4vh) scale(.94)}100%{transform:translate(16vw,24vh) scale(1)}}
@keyframes mancha-dois{0%{transform:translate(3vw,-2vh) scale(1)}35%{transform:translate(-18vw,20vh) scale(1.1)}70%{transform:translate(-34vw,38vh) scale(.92)}100%{transform:translate(-8vw,12vh) scale(1)}}
@keyframes mancha-tres{0%{transform:translate(-10vw,4vh) scale(1)}35%{transform:translate(18vw,-12vh) scale(1.08)}70%{transform:translate(34vw,8vh) scale(.95)}100%{transform:translate(4vw,-18vh) scale(1)}}
@keyframes sobe{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes pulsa{0%,60%,100%{opacity:.35;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
@keyframes flutua{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes fadeIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
:focus-visible{outline:2px solid var(--ouro);outline-offset:3px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto}}

/* ==========================================================================
   10. Conteudo servido pelo backend
   Preservado do layout anterior: e o markup que o JS monta a partir da
   resposta da API (cards de casa, chips, precos, WhatsApp). Fica como esta
   ate a etapa em que o card de casa for revisto.
   ========================================================================== */

/* ---------- selo da intencao detectada ---------- */
.intent-badge {
  display:inline-block;
  background:rgba(236,185,52,.14);
  color:var(--gold-dark);
  border-radius:999px;
  padding:3px 10px;
  font-size:11px;
  font-weight:700;
  margin-bottom:8px;
  letter-spacing:.5px;
  text-transform:uppercase;
}

/* ---------- card de casa ---------- */
.ai-casas-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:12px;
}
/* Botão de ação "Ver mais casas" ao final da exibição */
.load-more-wrap {
  display:flex;
  justify-content:center;
  margin-top:14px;
}
.load-more {
  display:inline-flex;
  align-items:center;
  gap:7px;
  background:var(--gold, #c79338);
  color:#fff;
  border:none;
  border-radius:999px;
  padding:10px 22px;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  transition:transform .2s, box-shadow .2s, opacity .2s;
  box-shadow:0 8px 20px -10px rgba(199, 147, 56, .7);
}
.load-more:hover { transform:translateY(-2px); box-shadow:0 12px 26px -10px rgba(199, 147, 56, .8); }
.load-more:active { transform:translateY(0); }
.load-more i { font-size:17px; }
.ai-casa-card {
  background:#fff;
  border:1px solid var(--border);
  border-radius:18px;
  overflow:hidden;
  transition:transform .2s, box-shadow .2s;
  text-decoration:none;
  color:inherit;
  display:flex;
  flex-direction:column;
  border: 1px solid rgba(255, 255, 255, .9);
  box-shadow: 0 18px 40px -26px rgba(32, 48, 62, .55), inset 0 0 0 1px rgba(199, 147, 56, .12);
}
.ai-casa-card:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(32,79,94,0.12); }
.ai-casa-card .thumb {
  width:100%; height:140px; background:#eee center/cover no-repeat; position:relative;
}
.ai-casa-card .thumb .ref-badge {
  position:absolute; top:8px; left:8px;
  background:var(--gold); color:#fff;
  font-size:11px; font-weight:700;
  padding:3px 8px; border-radius:999px;
  display: flex;
}
.ai-casa-card .thumb .rating-badge {
  position:absolute; top:8px; right:8px;
  background:rgba(0,0,0,.55); color:#fff;
  font-size:11px; font-weight:600;
  padding:3px 8px; border-radius:999px;
  display: none;
}
.ai-casa-card .body { padding:12px 14px; flex:1; display:flex; flex-direction:column; gap:6px; }
.ai-casa-card .title { font-size:14px; font-weight:700; color:var(--primary); margin:0; line-height:1.3; }
.ai-casa-card .area { font-size:12px; color:var(--muted); }
.ai-casa-card .features {
  display:flex; gap:10px; flex-wrap:nowrap; font-size:12px; color:var(--muted);
}

.ai-casa-card .features span {
  white-space:nowrap;
}
.ai-casa-card .features i { color:var(--muted); margin-right:2px; }
.ai-casa-card .themes {
  display:flex; gap:4px; flex-wrap:wrap; margin-top:2px;
}
.ai-casa-card .theme-tag {
  background:rgba(90,134,149,.12);
  color:var(--accent);
  font-size:10px; font-weight:600;
  padding:2px 7px; border-radius:999px;
}
.ai-casa-card .theme-tag.bed-tag {
    color: #fff;
    background: var(--muted);
    border: 1px solid rgba(255, 255, 255, .4);
    border-radius: 50px;
    backdrop-filter: blur(8px);
}
.ai-casa-card .price-row {
  margin-top:auto; padding-top:8px; border-top:1px solid var(--border);
  display:flex; justify-content:space-between; align-items:baseline;
}
.ai-casa-card .price-label { font-size:11px; color:var(--muted); }
.ai-casa-card .price-val { font-size:16px; font-weight:800; color:var(--gold-dark); }
.ai-casa-card .price-val small { font-size:11px; color:var(--muted); font-weight:500; }

/* ---------- filtros aplicados (chips read-only da resposta) ---------- */
.filters-applied {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin:8px 0 4px;
}
.filter-chip {
  display:inline-flex;
  align-items:center;
  gap:4px;
  background:var(--areia);
  border:1px solid rgba(90,134,149,.25);
  color:var(--muted);
  border-radius:999px;
  padding:4px 10px;
  font-size:12px;
  font-weight:600;
  line-height:1.2;
}
.filter-chip i {
  font-size:13px;
  color:var(--muted);
}
.filter-chip strong {
  font-weight:700;
  color:var(--primary);
}
.filters-applied-title {
  font-size:11px;
  font-weight:700;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.5px;
  margin:6px 0 2px;
}
.filters-applied-title.exclude-title {
  color:var(--danger);
}
.filter-chip.exclude {
  background:rgba(217,83,79,.08);
  border-color:rgba(217,83,79,.3);
  color:var(--danger);
}
.filter-chip.exclude i { color:var(--danger); }
.filter-chip.exclude strong { color:var(--danger); }

/* ---------- listas de temas / areas ---------- */
.ai-chips { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.ai-chip {
  background:rgba(236,185,52,.12);
  color:var(--gold-dark);
  border:1px solid rgba(236,185,52,.3);
  border-radius:999px;
  padding:6px 12px;
  font-size:13px;
  font-weight:600;
  cursor:pointer;
  transition:all .2s;
  font-family:inherit;
}
.ai-chip:hover { background:var(--gold); color:#fff; }
.ai-chip .count { font-size:11px; opacity:.7; margin-left:4px; }

/* ---------- alternativas ---------- */
.alt-section {
  margin-top:18px;
  padding-top:14px;
  border-top:1px dashed var(--border);
}
.alt-title {
  font-size:13px;
  font-weight:700;
  color:var(--gold-dark);
  margin:0 0 4px;
  display:flex;
  align-items:center;
  gap:6px;
}
.alt-title i { font-size:16px; }
.alt-subtitle {
  font-size:12px;
  color:var(--muted);
  margin:0 0 10px;
}

/* ---------- detalhamento de preco ---------- */
.price-breakdown {
  margin-top:10px;
  padding:10px 12px;
  background:rgba(90,134,149,.06);
  border-radius:10px;
  border:1px solid var(--border);
}
.price-breakdown .price-row {
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  font-size:13px;
  padding:3px 0;
  color:var(--text);
}
.price-breakdown .price-row.discount { color:var(--success); }
.price-breakdown .price-row.total {
  border-top:1px solid var(--border);
  margin-top:6px;
  padding-top:8px;
  font-size:15px;
  color:var(--primary);
}
.price-breakdown .price-row.total strong { color:var(--gold-dark); font-size:17px; }

/* ---------- escalada para o WhatsApp ---------- */
.whatsapp-cta {
  margin-top:14px;
  padding:16px;
  background:linear-gradient(135deg, #25D366 0%, #128C7E 100%);
  border-radius:14px;
  color:#fff;
  text-decoration:none;
  display:flex;
  align-items:center;
  gap:14px;
  transition:transform .2s, box-shadow .2s;
  box-shadow: 0 18px 40px -26px rgba(32, 48, 62, .55), inset 0 0 0 1px rgba(199, 147, 56, .12);
}
.whatsapp-cta:hover {
  transform:translateY(-2px);
  box-shadow:0 6px 20px rgba(37,211,102,.4);
}
.whatsapp-cta:active { transform:scale(.98); }
.whatsapp-cta .wa-icon {
  width:44px; height:44px;
  background:rgba(255,255,255,.2);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  flex-shrink:0;
  font-size:24px;
}
.whatsapp-cta .wa-text { flex:1; }
.whatsapp-cta .wa-title { font-size:15px; font-weight:700; margin:0 0 2px; }
.whatsapp-cta .wa-sub { font-size:12px; opacity:.9; margin:0; }
.whatsapp-cta .wa-arrow { font-size:20px; opacity:.8; }
.whatsapp-msg-preview {
  margin-top:10px;
  padding:10px 12px;
  background:rgba(37,211,102,.06);
  border:1px dashed rgba(37,211,102,.3);
  border-radius:10px;
  font-size:12px;
  color:var(--muted);
  white-space:pre-wrap;
  line-height:1.5;
  display: none;
}
.whatsapp-msg-preview-title {
  font-size:11px;
  font-weight:700;
  color:var(--success);
  text-transform:uppercase;
  letter-spacing:.5px;
  margin-bottom:4px;
}

/* ---------- erro e nova tentativa ---------- */
.error-text { color:var(--danger); }
.error-msg { color:var(--danger); margin:0 0 10px; }
.retry-btn {
  display:inline-flex;
  align-items:center;
  gap:6px;
  background:var(--primary);
  color:#fff;
  border:none;
  border-radius:999px;
  padding:8px 16px;
  font-size:13px;
  font-weight:600;
  font-family:inherit;
  cursor:pointer;
  transition:all .2s;
}
.retry-btn:hover { background:var(--primary-dark); }
.retry-btn:active { transform:scale(.96); }

/* ---------- overlay "limpando conversa" ---------- */
.reset-overlay {
  position:fixed;
  inset:0;
  background:rgba(251,248,242,.85);
  backdrop-filter:blur(2px);
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:9999;
  animation:fadeIn .2s ease;
}
.reset-overlay .reset-box {
  background:#fff;
  border:1px solid var(--border);
  border-radius:16px;
  padding:28px 36px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
  box-shadow:0 8px 30px rgba(32,79,94,.15);
}
.reset-overlay .reset-spinner {
  width:40px; height:40px;
  border:3px solid rgba(236,185,52,.25);
  border-top-color:var(--gold);
  border-radius:50%;
  animation:spin .8s linear infinite;
}
.reset-overlay .reset-text {
  font-size:15px;
  font-weight:600;
  color:var(--primary);
}

/* 11. Pontes */
.msg.user{justify-content:flex-end}
.msg .avatar{width:64px;height:64px;flex:none;margin-top:2px;position:relative;
  display:grid;place-items:center}
.msg .avatar img{width:60%;aspect-ratio:1/1;object-fit:contain}
.msg .avatar::before{content:"";position:absolute;inset:0;border-radius:50%;opacity:.6;
  background:radial-gradient(circle at 50% 45%,rgba(255,255,255,.95),rgba(255,255,255,.55) 58%,rgba(255,255,255,0) 72%);
  box-shadow:0 26px 54px -30px rgba(169,118,31,.9),inset 0 0 0 1px rgba(199,147,56,.18);
  backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%)}
/* o avatar do usuario e um icone, nao a logo: dispensa o halo */
.msg.user .avatar{width:34px;height:34px;border-radius:50%;color:#fff;font-size:18px;
  background:linear-gradient(140deg,var(--ouro),var(--ouro-escuro))}
.msg.user .avatar::before{display:none}

/* .bubble -> .bolha */
.msg .bubble{padding:14px 18px;border-radius:20px;font-size:15px;line-height:1.62;
  max-width:min(620px,88%)}
.msg.ai .bubble{background:var(--vidro);backdrop-filter:blur(24px) saturate(160%);
  -webkit-backdrop-filter:blur(24px) saturate(160%);border:var(--vidro-borda);
  box-shadow:var(--vidro-sombra),var(--vidro-fio);border-top-left-radius:6px}
.msg.user .bubble{color:#fff;border-top-right-radius:6px;
  background:linear-gradient(140deg,var(--ouro),var(--ouro-escuro));
  box-shadow:0 18px 34px -22px rgba(169,118,31,1),inset 0 1px 0 rgba(255,255,255,.3)}
.msg .bubble p { margin:0 0 8px; }
.msg .bubble p:last-child { margin-bottom:0; }
.msg .bubble strong { font-weight:600; }
.msg .bubble ul { margin:6px 0; padding-left:20px; }
.msg .bubble li { margin-bottom:3px; }

/* typing animation - pontinhos */
.typing{display:inline-flex;gap:5px;padding:4px 2px}
.typing span{width:7px;height:7px;border-radius:50%;background:var(--ouro);opacity:.45;
  animation:pulsa 1.3s infinite}
.typing span:nth-child(2){animation-delay:.18s}
.typing span:nth-child(3){animation-delay:.36s}

/* ---------- 12. responsivo ---------- */
@media (max-width:820px){
  .palco{padding:12px 14px 14px}
  .inicios{grid-template-columns:1fr;gap:9px}
  .inicio{flex-direction:row;justify-content:flex-start;text-align:left;gap:12px;padding:13px}
  .inicio .ic{margin-bottom:0;flex:none}
  .inicio p{display:none}
  .abertura{padding-top:14px}
  .abertura h2{font-size:30px}
  .bolha,
  .msg .bubble{max-width:92%}
  .direita .btn-fantasma:last-child{display:none}
}
@media (max-width:600px){
  .ai-casas-grid { grid-template-columns:1fr; }
  /* .ai-casa-card .features { flex-wrap:wrap; } */
  .msg.ai .avatar{
    display:none;
  }
}

.logo img{
  filter:invert(1);
}