/* Ether 3.13.2 — barra compacta, Ether visível, balão com puxador. */
:root{
  --ether-azul:#7fd4ff;
  --ether-noite:#171310;
  --ether-ouro:#c9a227;
  --ether-ink:#23262e;
}
#ether-root{
  position:fixed;left:0;right:0;bottom:0;z-index:99990;
  font-family:'Montserrat',system-ui,sans-serif;
}
body{padding-bottom:calc(72px + env(safe-area-inset-bottom,0px))}

/* —— Barra compacta, sem borda cinzenta pesada —— */
.ether-bar{
  position:relative;z-index:2;
  background:linear-gradient(180deg,rgba(250,251,253,.98),rgba(236,238,243,.98));
  backdrop-filter:blur(12px);
  border-top:none;
  padding:5px 10px calc(4px + env(safe-area-inset-bottom,0px));
  display:flex;flex-direction:column;align-items:stretch;gap:3px;
  box-shadow:0 -4px 18px rgba(20,22,30,.08);
}
.ether-bar-inner{
  display:flex;align-items:center;gap:6px;
  width:100%;max-width:720px;margin:0 auto;
}

/* Mini (só se não houver corpo) */
.ether-mini{width:28px;height:34px;flex:0 0 auto}
.ether-mini svg{width:100%;height:100%;display:block}
.ether-ring{stroke:var(--ether-azul);stroke-width:2.4;fill:none;animation:ether-respira 4s ease-in-out infinite}
@keyframes ether-respira{0%,100%{opacity:.45}50%{opacity:1}}
.ether-pensa .ether-ring{animation:ether-pulsa .9s ease-in-out infinite}
@keyframes ether-pulsa{0%,100%{stroke-width:2.4;opacity:.55}50%{stroke-width:4.2;opacity:1}}

/* Campo */
.ether-campo{position:relative;flex:1;min-width:0;display:none}
.ether-campo input{
  width:100%;box-sizing:border-box;
  background:rgba(255,255,255,.9);
  border:1px solid rgba(120,126,140,.22);
  border-radius:999px;
  color:var(--ether-ink);
  padding:9px 14px;
  font-size:14.5px;outline:none;font-family:inherit;
}
.ether-campo input:focus{
  border-color:rgba(127,212,255,.65);
  box-shadow:0 0 0 3px rgba(127,212,255,.16);
}
.ether-campo input::placeholder{color:#9aa0ab}

/* Botões circulares */
.ether-btn{
  flex:0 0 auto;width:38px;height:38px;border-radius:50%;
  border:1px solid rgba(120,126,140,.22);
  background:rgba(255,255,255,.92);color:var(--ether-ink);
  display:none;place-items:center;cursor:pointer;padding:0;
  box-shadow:0 1px 2px rgba(20,22,30,.07);
  transition:transform .08s, background .15s;
}
.ether-btn:active{transform:scale(.96)}
.ether-btn svg{display:block}
.ether-volta{display:none}
.ether-envia{display:none;background:var(--ether-ink);border-color:var(--ether-ink);color:#f4f4f6}
.ether-mute{display:none}

/* Ondas */
.ether-voz-caixa{
  display:none;position:relative;flex:1;min-width:0;
  height:38px;border-radius:999px;
  background:rgba(20,16,14,.05);overflow:hidden;
}
.ether-ondas{display:none;position:absolute;inset:0;width:100%;height:100%}

/* Modo texto */
.ether-bar.modo-texto .ether-mini{display:none}
.ether-bar.modo-texto .ether-volta{display:grid}
.ether-bar.modo-texto .ether-campo{display:block}
.ether-bar.modo-texto .ether-envia{display:grid}
.ether-bar.modo-texto .ether-modos{display:none}
.ether-bar.modo-texto .ether-chips-repouso{display:none}

/* Modo chamada */
#ether-root.ether-em-chamada .ether-mini{display:none}
#ether-root.ether-em-chamada .ether-campo{display:none}
#ether-root.ether-em-chamada .ether-envia{display:none}
#ether-root.ether-em-chamada .ether-voz-caixa{display:block}
#ether-root.ether-em-chamada .ether-ondas{display:block}
#ether-root.ether-em-chamada .ether-mute{display:grid}
#ether-root.ether-em-chamada .ether-modos{flex:0 0 auto}
#ether-root.ether-em-chamada .ether-convite,
#ether-root.ether-em-chamada .ether-modo-escrever,
#ether-root.ether-em-chamada .ether-chips-repouso{display:none}
#ether-root.ether-em-chamada .ether-modos-btns{width:auto}
#ether-root.ether-em-chamada .ether-modo-falar{
  flex:0 0 auto;width:38px;height:38px;padding:0;border-radius:50%;
  background:#b0392f;border-color:#b0392f;color:#fff;
}

/* —— Balão: largura total, mais claro, puxador + X —— */
.ether-balao{
  display:none;position:absolute;bottom:calc(100% + 4px);
  left:50%;right:auto;transform:translateX(-50%);
  width:min(100%,720px);max-width:720px;
  background:rgba(42,38,36,.92);
  backdrop-filter:blur(14px);
  border:none;border-radius:16px 16px 0 0;
  padding:6px 12px 10px;
  box-shadow:0 -6px 28px rgba(0,0,0,.28);
  z-index:3;pointer-events:auto;
}
@media (max-width:740px){
  .ether-balao{left:0;right:0;transform:none;width:100%;max-width:100%;border-radius:16px 16px 0 0}
}
.ether-balao.on{display:block;overscroll-behavior:contain;touch-action:pan-y}
.ether-balao-handle{
  width:48px;height:5px;border-radius:3px;
  background:rgba(255,255,255,.55);
  margin:4px auto 10px;
  cursor:grab;touch-action:none;
  box-shadow:0 1px 0 rgba(0,0,0,.15);
}
.ether-balao-handle::before{
  content:"";display:block;margin:-12px -24px -8px;
  height:28px;
}
.ether-balao-top{
  display:flex;justify-content:space-between;align-items:center;
  gap:8px;margin-bottom:2px;
}
#ebvQuem{
  font-size:10px;letter-spacing:.16em;font-weight:700;
  text-transform:uppercase;color:var(--ether-azul);
}
#ebvQuem.eu{color:#e8b98a}
#ebvEstado{font-size:10px;letter-spacing:.04em;color:rgba(255,255,255,.38);font-variant-numeric:tabular-nums;margin-right:auto;padding-left:8px}
.ether-balao-x{
  flex:0 0 auto;width:28px;height:28px;border-radius:50%;
  border:0;background:rgba(255,255,255,.1);color:rgba(255,255,255,.75);
  display:grid;place-items:center;cursor:pointer;padding:0;
}
.ether-balao-x:active{background:rgba(255,255,255,.2)}
#ebvTexto{
  color:#f2eee9;font-family:Georgia,serif;font-size:14.5px;line-height:1.45;
  max-height:26svh;overflow-y:auto;white-space:pre-wrap;min-height:1.1em;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
}
.ether-balao-chips:empty{display:none}

/* Modos de repouso — compactos */
.ether-modos{flex:1;display:flex;flex-direction:column;gap:4px;align-items:stretch;min-width:0;max-width:720px;margin:0 auto;width:100%}
.ether-convite{
  text-align:center;font-size:12px;color:rgba(40,36,34,.72);min-height:14px;
  background:transparent;border:0;border-radius:0;padding:2px 6px 0;
  font-style:italic;letter-spacing:.01em;
}
.ether-convite:empty{display:none}
.ether-modos-btns{display:flex;gap:6px}
.ether-modo{
  flex:1;display:flex;align-items:center;justify-content:center;gap:6px;
  padding:8px 6px;border-radius:10px;
  font-family:'Montserrat',sans-serif;font-size:13px;font-weight:600;
  cursor:pointer;border:1px solid transparent;
  transition:transform .08s;
}
.ether-modo:active{transform:translateY(1px)}
.ether-modo-escrever{
  background:linear-gradient(180deg,#fff,#eef0f4);
  border-color:rgba(120,126,140,.22);color:var(--ether-ink);
  box-shadow:0 1px 2px rgba(20,22,30,.06);
}
.ether-modo-falar{
  background:linear-gradient(180deg,#2a2f38,#191c23);
  border-color:rgba(127,212,255,.12);color:#f0ece7;
  box-shadow:0 1px 2px rgba(20,22,30,.18);
}

/* Chips — sólidos e centrados */
.ether-chips-repouso{
  display:flex;gap:6px;flex-wrap:nowrap;justify-content:center;
  overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
  padding:2px 1px 0;
}
.ether-chips-repouso::-webkit-scrollbar{display:none}
.ether-chip{
  flex:0 0 auto;
  border:1px solid rgba(120,126,140,.28);
  background:#ffffff;
  color:var(--ether-ink);
  border-radius:999px;
  padding:5px 11px;
  font-size:11.5px;line-height:1.25;font-weight:500;
  cursor:pointer;font-family:'Montserrat',sans-serif;
  white-space:nowrap;
  box-shadow:0 1px 2px rgba(20,22,30,.06);
}
.ether-chip:hover{border-color:rgba(127,212,255,.55)}
.ether-balao-chips{
  display:flex;gap:6px;flex-wrap:wrap;justify-content:center;
  overflow:visible;margin-top:8px;
}
.ether-balao .ether-chip{
  background:#ffffff;
  border-color:rgba(255,255,255,.95);
  color:#23262e;font-size:11.5px;padding:5px 11px;font-weight:500;
}

.ether-aiact-mini,.ether-convite{display:none!important}

/* —— Corpo do Ether: visível e clicável —— */
.tem-corpo .ether-mini{display:none}
.ether-corpo{
  position:absolute;left:6px;bottom:0;
  height:min(28vh,230px);z-index:1;
  pointer-events:auto;cursor:pointer;
  transition:opacity .2s, transform .2s;
}
/* Desktop largo: corpo mais baixo para não cobrir o CTA do hero */
@media (min-width:821px){
  .ether-corpo{height:min(26vh,200px);left:10px}
}
.ether-corpo img{
  height:100%;width:auto;display:block;
  filter:drop-shadow(0 4px 14px rgba(0,0,0,.4));
  pointer-events:none;
}
.ether-corpo:active{transform:scale(.98)}
.ether-visor{
  position:absolute;top:3.2%;left:50%;transform:translateX(-50%);
  width:36%;height:8.5%;border-radius:50%;
  background:radial-gradient(ellipse at center,rgba(130,195,255,.95) 0%,rgba(90,160,255,.35) 45%,transparent 72%);
  filter:blur(3px);opacity:0;pointer-events:none;
}
#ether-root.ether-escreve .ether-visor,
#ether-root.ether-avoz .ether-visor,
#ether-root.ether-em-chamada .ether-visor{animation:etherCintila 1.1s linear infinite}
@keyframes etherCintila{0%{opacity:.25}22%{opacity:.85}45%{opacity:.4}68%{opacity:1}100%{opacity:.3}}

/* Em chamada/texto o corpo continua visível, só um pouco mais atrás */
#ether-root.ether-em-chamada .ether-corpo,
.ether-bar.modo-texto ~ .ether-corpo,
#ether-root:has(.modo-texto) .ether-corpo{
  opacity:.92;
}

@media (max-width:720px){
  #ether-root.ether-teclado .ether-corpo{opacity:.35}
}
@media (max-width:520px){
  .ether-corpo{height:min(26vh,200px);left:2px}
  .ether-modo{font-size:12px;padding:7px 5px}
}
@media (prefers-reduced-motion:reduce){
  .ether-ring,#ether-root.ether-escreve .ether-visor,
  #ether-root.ether-avoz .ether-visor,
  #ether-root.ether-em-chamada .ether-visor{animation:none}
}

/* Chip de ordem: estilo apresentação (dourado + castanho) */
.ether-gancho-host{
  position:relative;
  overflow:visible;
}
.ether-gancho-host > h1,
.ether-gancho-host > h2,
.ether-gancho-host h2:first-of-type,
.ether-gancho-host .eloja-titulo,
.ether-gancho-host .eloja-h{
  padding-right:min(48%, 168px);
}
/* Lomba: margem castanha igual ao cartão, fora da linha dourada */
.ether-gancho-lomba{
  position:absolute;
  top:0;right:12px;
  transform:translateY(-50%);
  z-index:6;
  padding:5px 6px;
  border-radius:999px;
  background:#2a1c16;
  line-height:0;
  pointer-events:none;
}
.ether-gancho-lomba .ether-gancho{pointer-events:auto}
/* Botão: letra dourada, fundo castanho escuro, linha dourada */
.ether-gancho{
  position:static;
  display:inline-block;
  border:1.5px solid #c9a227;
  background:#1a1210;
  color:#c9a227;
  font:600 11.5px/1 Montserrat,system-ui,sans-serif;
  letter-spacing:.03em;
  border-radius:999px;
  padding:7px 12px;
  cursor:pointer;
  margin:0;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.ether-gancho:hover,.ether-gancho:focus{
  background:#241814;
  color:#e8d48a;
  border-color:#e8d48a;
  outline:none;
}
.ether-gancho:active{transform:scale(.97)}
/* Hero: sem chip */
.vdm-hero .ether-gancho-lomba,
[data-ether-sec="hero"] .ether-gancho-lomba{display:none}


/* Mobile: sem overflow horizontal (desktop intacto) */
@media (max-width:760px){
  #ether-root{
    width:100%;max-width:100vw;
    left:0;right:0;
  }
  .ether-bar{
    width:100%;max-width:100%;
    overflow-x:hidden;
    box-sizing:border-box;
    padding-left:max(8px, env(safe-area-inset-left));
    padding-right:max(8px, env(safe-area-inset-right));
  }
  .ether-bar-inner,
  .ether-modos,
  .ether-chips-repouso{
    width:100%;max-width:100%;
    min-width:0;
    box-sizing:border-box;
  }
  .ether-chips-repouso{
    overflow-x:auto;
    overscroll-behavior-x:contain;
    justify-content:flex-start;
    padding-left:2px;padding-right:2px;
  }
  .ether-modos-btns{min-width:0}
  .ether-corpo{
    height:min(20vh,150px);
    left:0;
    opacity:.88;
  }
  body{overflow-x:hidden}
}
