/* Esmeralda chat widget. Uses the site tokens from site.css (light and dark follow them). */
.esm{font-family:var(--f-body,Manrope,system-ui,sans-serif);color:var(--text-primary,#132B25)}
.esm svg{display:block}
.esm-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* Gem mark */
.esm-g1{fill:none;stroke:currentColor;stroke-width:2.6;stroke-linejoin:round}
.esm-g2{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round;opacity:.8}

/* Launcher */
.esm-launch{position:fixed;z-index:60;right:calc(20px + env(safe-area-inset-right,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));
  width:60px;height:60px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;
  background:var(--accent,#0F5A45);color:var(--on-accent,#FBF8F1);
  box-shadow:0 14px 34px -12px rgba(0,0,0,.45),0 0 0 1px var(--hair,rgba(19,43,37,.12));
  transition:transform .35s var(--ease,ease),opacity .3s var(--ease,ease),background-color .3s var(--ease,ease)}
.esm-launch svg{width:30px;height:24px}
.esm-launch:hover{background:var(--accent-hover,#0B4636);transform:translateY(-2px)}
.esm-launch:focus-visible{outline:2px solid var(--accent,#0F5A45);outline-offset:4px}
.esm.is-open .esm-launch{visibility:hidden}
/* Tucked away while a form field, button or link crosses the bottom strip it would cover */
.esm.is-tucked:not(.is-open) .esm-launch{transform:translateY(calc(100% + 40px));opacity:0;pointer-events:none}
.esm.is-tucked:not(.is-open) .esm-launch:focus-visible{transform:none;opacity:1;pointer-events:auto}

/* Panel */
.esm-panel:focus{outline:none}
.esm-panel{position:fixed;z-index:61;right:calc(20px + env(safe-area-inset-right,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));
  width:380px;max-width:calc(100vw - 40px);height:560px;max-height:calc(100vh - 110px);max-height:calc(100dvh - 110px);
  display:flex;flex-direction:column;overflow:hidden;
  background:var(--panel,#FBF8F1);border:1px solid var(--hair,rgba(19,43,37,.12));border-radius:22px;
  box-shadow:0 30px 70px -30px rgba(0,0,0,.5),var(--shadow,none);
  opacity:0;transform:translateY(12px) scale(.98);transform-origin:100% 100%;
  transition:opacity .3s var(--ease,ease),transform .4s var(--ease,ease)}
.esm.is-in .esm-panel{opacity:1;transform:none}

.esm-head{flex:none;padding:14px 14px 12px 16px;border-bottom:1px solid var(--hair,rgba(19,43,37,.12));display:grid;gap:12px}
.esm-who{display:flex;align-items:center;gap:12px;min-width:0}
.esm-ava{flex:none;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--accent,#0F5A45);color:var(--on-accent,#FBF8F1)}
.esm-ava svg{width:22px;height:18px}
.esm-id{flex:1;min-width:0}
.esm-name{margin:0;font:600 22px/1.05 var(--f-display,Georgia,serif);letter-spacing:.01em;color:var(--text-primary,#132B25)}
.esm-sub{margin:2px 0 0;font:400 11.5px/1.3 var(--f-mono,monospace);letter-spacing:.12em;text-transform:uppercase;color:var(--text-secondary,#4B5B54)}
.esm-x{flex:none;width:44px;height:44px;margin:-4px -4px -4px 0;padding:0;border:0;border-radius:50%;background:none;display:grid;place-items:center;color:var(--text-primary,#132B25);transition:background-color .25s}
.esm-x:hover{background:var(--hair,rgba(19,43,37,.12))}
.esm-x svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.esm-call{display:flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:10px 16px;border-radius:999px;
  background:var(--accent,#0F5A45);color:var(--on-accent,#FBF8F1);font:700 15px/1.2 var(--f-body,sans-serif);text-decoration:none;
  transition:background-color .25s var(--ease,ease)}
.esm-call:hover{background:var(--accent-hover,#0B4636)}
.esm-call svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}
.esm :focus-visible{outline:2px solid var(--accent,#0F5A45);outline-offset:3px}
.esm-call:focus-visible{outline-color:var(--text-primary,#132B25)}

/* Conversation */
.esm-log{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:16px;display:flex;flex-direction:column;gap:10px;scroll-behavior:smooth}
.esm-log:focus{outline:none}
.esm-hint{margin:auto 0;text-align:center;padding:12px 8px;color:var(--text-secondary,#4B5B54)}
.esm-hint1{margin:0 0 6px;font:500 italic 21px/1.25 var(--f-display,Georgia,serif);color:var(--text-primary,#132B25)}
.esm-hint2{margin:0;font-size:14px;line-height:1.5}
.esm-msg{display:flex}
.esm-msg p{margin:0;max-width:86%;padding:10px 14px;border-radius:18px;font-size:15px;line-height:1.5;white-space:pre-wrap;overflow-wrap:anywhere}
.esm-b p{background:var(--canvas,#F3EEE3);color:var(--text-primary,#132B25);border:1px solid var(--hair,rgba(19,43,37,.12));border-bottom-left-radius:6px}
.esm-u{justify-content:flex-end}
.esm-u p{background:var(--accent,#0F5A45);color:var(--on-accent,#FBF8F1);border-bottom-right-radius:6px}

.esm-typing{flex:none;display:flex;align-items:center;gap:5px;padding:0 16px 8px;height:22px}
.esm-typing span{width:7px;height:7px;border-radius:50%;background:var(--accent-muted,#C9A55C);animation:esm-dot 1.2s infinite ease-in-out}
.esm-typing span:nth-child(2){animation-delay:.15s}
.esm-typing span:nth-child(3){animation-delay:.3s}
.esm-typing em{margin-left:6px;font:400 11px/1 var(--f-mono,monospace);font-style:normal;letter-spacing:.08em;color:var(--text-secondary,#4B5B54)}
@keyframes esm-dot{0%,80%,100%{opacity:.3;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}

/* Composer */
.esm-form{flex:none;display:flex;align-items:flex-end;gap:8px;padding:10px 12px 12px;border-top:1px solid var(--hair,rgba(19,43,37,.12))}
.esm-form textarea{flex:1;min-width:0;min-height:46px;max-height:120px;resize:none;margin:0;padding:12px 14px;border-radius:16px;
  border:1px solid var(--line-strong,#6F7F78);background:var(--canvas,#F3EEE3);color:var(--text-primary,#132B25);
  font:400 16px/1.35 var(--f-body,sans-serif)}
.esm-form textarea::placeholder{color:var(--text-secondary,#4B5B54);opacity:1}
.esm-form textarea:focus-visible{outline:2px solid var(--accent,#0F5A45);outline-offset:1px}
.esm-send{flex:none;width:46px;height:46px;padding:0;border:0;border-radius:50%;display:grid;place-items:center;background:var(--accent,#0F5A45);color:var(--on-accent,#FBF8F1);transition:background-color .25s}
.esm-send:hover{background:var(--accent-hover,#0B4636)}
.esm-send svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

.esm-scrim{position:fixed;inset:0;z-index:60;background:rgba(10,20,17,.42)}

/* Phones (portrait and landscape): full-width bottom sheet. Keep in sync with SHEET_Q in esmeralda.js */
@media (max-width:480px),(max-height:500px){
  .esm-panel{left:0;right:0;bottom:0;width:auto;max-width:none;height:88vh;height:88dvh;max-height:none;
    border-radius:22px 22px 0 0;border-bottom:0;
    padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px);padding-bottom:env(safe-area-inset-bottom,0px);
    transform:translateY(24px);transform-origin:50% 100%}
  .esm-msg p{max-width:90%}
}
/* Landscape phones: full height, compact header (avatar hidden, call button beside the name) */
@media (max-height:500px){
  .esm-panel{height:100vh;height:100dvh;border-radius:0}
  .esm-ava{display:none}
  .esm-head{grid-template-columns:1fr auto;align-items:center}
}
html.esm-lock,html.esm-lock body{overflow:hidden!important;overscroll-behavior:none}

@media (prefers-reduced-motion:reduce){
  .esm-launch,.esm-panel,.esm-log{transition:none!important;scroll-behavior:auto}
  .esm-panel{transform:none!important}
  .esm-typing span{animation:none;opacity:.7}
}
