#eclar-webchat { --ew-blue:#1769e0; --ew-ink:#171719; color:var(--ew-ink); font-family:"Open Sans",Arial,sans-serif; font-size:14px; line-height:1.5; }
#eclar-webchat *, #eclar-webchat *::before, #eclar-webchat *::after { box-sizing:border-box; }
#eclar-webchat[hidden], #eclar-webchat [hidden] { display:none!important; }
#eclar-webchat button, #eclar-webchat textarea { font:inherit; }
#eclar-webchat button { cursor:pointer; -webkit-tap-highlight-color:transparent; }
#eclar-webchat button:focus-visible, #eclar-webchat textarea:focus-visible, #eclar-webchat [tabindex]:focus-visible { outline:3px solid #72adff; outline-offset:3px; }
#eclar-webchat svg { display:block; width:24px; height:24px; flex-shrink:0; }
/* The button hit area stays fixed while only its decorative character moves. */
#eclar-webchat .ew-launcher { position:fixed; z-index:1001; right:max(16px,env(safe-area-inset-right)); bottom:max(16px,env(safe-area-inset-bottom)); width:76px; height:76px; display:grid; place-items:center; padding:0; color:#fff; background:transparent; border:0; border-radius:50%; }
#eclar-webchat .ew-launcher-label { position:absolute; bottom:calc(100% + 1px); right:0; padding:8px 13px; border:1px solid #e3e7ed; border-radius:16px; background:#fff; color:#171719; font-size:12px; font-weight:700; white-space:nowrap; box-shadow:0 3px 15px #0a142414; transform:translateY(var(--ew-jelly-y,0px)); transition:opacity .2s; }
/* Speech tail meets the character's crown; the whole bubble remains one chat button. */
#eclar-webchat .ew-launcher-label::after { content:""; position:absolute; width:12px; height:12px; bottom:-7px; right:31px; background:#fff; border-right:1px solid #e3e7ed; border-bottom:1px solid #e3e7ed; border-radius:0 0 3px 0; transform:rotate(45deg); pointer-events:none; }
#eclar-webchat .ew-launcher[aria-expanded="true"] .ew-launcher-label { opacity:0; }
#eclar-webchat .ew-mascot { position:relative; display:grid; place-items:center; width:64px; height:64px; background:radial-gradient(circle at 32% 22%,#27272d,#080809 65%); border:1px solid #33343c; border-radius:var(--ew-shape,50%); box-shadow:0 8px 18px #0003,inset 0 -3px 8px #0008; transform:translateY(var(--ew-drift,0px)) rotate(var(--ew-lean,0deg)) scale(var(--ew-squash,1),var(--ew-stretch,1)); transition:border-color .25s; animation:ew-mascot-breathe 5s ease-in-out infinite; pointer-events:none; }
#eclar-webchat .ew-mascot-eyes { display:flex; gap:11px; transform:translate(var(--ew-look-x,0px),var(--ew-look-y,0px)); transition:transform .18s ease-out; }
#eclar-webchat .ew-mascot-eye { position:relative; width:11px; height:19px; border-radius:7px; transform:rotate(var(--ew-eye-tilt,0deg)) scaleY(var(--ew-eye-height,1)); transition:height .3s,border-radius .3s; background:linear-gradient(#7adfff,#228bff 75%); box-shadow:0 0 8px #1769e0aa; animation:ew-mascot-blink 6.5s infinite; }
#eclar-webchat .ew-mascot-eye::after { content:""; position:absolute; top:3px; left:2px; width:3px; height:4px; border-radius:50%; background:#d8faff; opacity:.85; }
#eclar-webchat .ew-mascot-eye:last-child { transform:rotate(calc(var(--ew-eye-tilt,0deg) * -1)) scaleY(var(--ew-eye-height,1)); animation-delay:.08s; }
#eclar-webchat .ew-launcher:focus-visible .ew-mascot-eye { height:13px; border-radius:9px 9px 5px 5px; }
@media(hover:hover){#eclar-webchat .ew-launcher:hover .ew-mascot-eye{height:13px;border-radius:9px 9px 5px 5px}}
#eclar-webchat .ew-launcher:hover .ew-mascot,#eclar-webchat .ew-launcher:focus-visible .ew-mascot { border-color:#1769e0; }
#eclar-webchat .ew-mascot-paused .ew-mascot,#eclar-webchat .ew-mascot-paused .ew-mascot-eye { animation-play-state:paused; }
@keyframes ew-mascot-breathe { 0%,100%{translate:0 0}50%{translate:0 -3px} }
@keyframes ew-mascot-blink { 0%,43%,47%,100%{scale:1 1}45%{scale:1 .12}72%,76%{scale:1 1}74%{scale:1 .25} }
@media(prefers-reduced-motion:reduce){#eclar-webchat .ew-mascot,#eclar-webchat .ew-mascot-eye{animation:none;transform:none}#eclar-webchat .ew-mascot,#eclar-webchat .ew-mascot-eyes,#eclar-webchat .ew-launcher-label{transition:none}}
#eclar-webchat .ew-panel { position:fixed; z-index:1002; right:max(12px,env(safe-area-inset-right)); bottom:max(12px,env(safe-area-inset-bottom)); display:flex; flex-direction:column; width:calc(100% - 24px); max-width:400px; height:580px; max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); border:1px solid #e1e5eb; border-radius:22px; overflow:hidden; background:#fff; box-shadow:0 24px 80px #0b162d30,0 4px 16px #0b162d12; animation:ew-appear .18s ease-out; }
#eclar-webchat .ew-header { display:flex; align-items:center; gap:12px; padding:20px 16px; background:#fff; }
#eclar-webchat .ew-avatar { display:flex; align-items:center; justify-content:center; gap:3px; width:44px; height:44px; flex-shrink:0; border-radius:14px; background:var(--ew-ink); color:#fff; font-size:30px; line-height:1; font-weight:800; letter-spacing:0; }
#eclar-webchat .ew-avatar-dot { width:8px; height:8px; flex-shrink:0; border-radius:50%; background:linear-gradient(135deg,#1769e0,#48d4d7); transform:translateY(8px); }
#eclar-webchat .ew-heading { flex:1; min-width:0; }
#eclar-webchat .ew-heading h2 { margin:0; font-size:18px; letter-spacing:-.6px; }
#eclar-webchat .ew-heading p { margin:3px 0 0; color:#636b77; font-size:11px; }
#eclar-webchat .ew-close { display:grid; place-items:center; width:44px; height:44px; padding:0; flex-shrink:0; background:#f3f5f7; color:#555e69; border:0; border-radius:50%; }
#eclar-webchat .ew-messages { flex:1; min-height:70px; overflow-y:auto; overscroll-behavior:contain; padding:20px 16px 12px; background:#fafbfc; }
#eclar-webchat .ew-message { width:fit-content; max-width:91%; margin:0 0 14px; padding:12px 14px; border:1px solid #e6e9ee; border-radius:3px 16px 16px; background:#fff; overflow-wrap:anywhere; }
#eclar-webchat .ew-message p { margin:5px 0 0; font-size:13px; line-height:1.7; white-space:pre-wrap; }
#eclar-webchat .ew-sender { color:#626b77; font-size:10px; font-weight:700; }
#eclar-webchat .ew-message-visitor { margin-left:auto; color:#fff; background:var(--ew-blue); border-color:var(--ew-blue); border-radius:16px 3px 16px 16px; }
#eclar-webchat .ew-message-visitor .ew-sender { color:#e2eeff; }
#eclar-webchat .ew-suggestions { display:flex; flex-wrap:wrap; gap:7px; padding:8px 16px 14px; background:#fafbfc; }
#eclar-webchat .ew-suggestions button { min-height:36px; padding:7px 11px; border:1px solid #d8e4f4; border-radius:18px; background:#fff; color:#185bb4; font-size:11px; }
#eclar-webchat .ew-suggestions button:hover { background:#edf4fe; }
#eclar-webchat .ew-form { display:flex; align-items:flex-end; gap:8px; margin:0; padding:14px 14px 8px; border-top:1px solid #e9edf2; }
#eclar-webchat textarea { flex:1; min-width:0; height:44px; max-height:96px; padding:11px 12px; resize:none; border:1px solid #e1e5eb; border-radius:12px; background:#fff; color:var(--ew-ink); font-size:16px; line-height:22px; }
#eclar-webchat textarea::placeholder { color:#787f88; }
#eclar-webchat .ew-send { display:grid; place-items:center; width:44px; height:44px; padding:0; border:0; border-radius:12px; background:var(--ew-blue); color:#fff; }
#eclar-webchat .ew-send:disabled { cursor:default; background:#e8edf4; color:#8e99a9; }
#eclar-webchat .ew-footnote { margin:0; padding:0 16px 12px; text-align:center; color:#6e7682; font-size:9px; }
#eclar-webchat .ew-sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
@media(min-width:600px) {
  #eclar-webchat .ew-launcher { right:24px; bottom:24px; }
  #eclar-webchat .ew-panel { right:24px; bottom:94px; max-height:calc(100dvh - 118px); }
}
@keyframes ew-appear { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
@media(prefers-reduced-motion:reduce) { #eclar-webchat .ew-panel { animation:none; } #eclar-webchat .ew-launcher { transition:none; } }

#eclar-webchat .ew-sound{font:inherit;font-size:11px;border:0;background:#f3f5f7;color:#555e69;border-radius:8px;padding:8px;min-height:44px;cursor:pointer;flex-shrink:0}

#eclar-webchat .ew-older{align-self:center;flex-shrink:0;margin:6px;border:1px solid #d8e4f4;border-radius:12px;padding:8px 12px;background:#fff;color:#185bb4;font-size:12px}

/* Keep the composer intact when the keyboard reduces available height. */
#eclar-webchat .ew-header,
#eclar-webchat .ew-form,
#eclar-webchat .ew-footnote,
#eclar-webchat .ew-suggestions { flex-shrink:0; }
#eclar-webchat .ew-messages { min-height:0; }
#eclar-webchat textarea { min-height:44px; overflow-y:auto; }
#eclar-webchat .ew-send { flex:0 0 44px; }
@media(max-width:599px){
 #eclar-webchat .ew-panel {
  top:calc(var(--ew-visible-top,0px) + 12px + env(safe-area-inset-top));
  bottom:auto;
  height:calc(var(--ew-visible-height,100dvh) - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));
  max-height:none;
 }
 #eclar-webchat .ew-header { padding:12px; }
 #eclar-webchat .ew-form { padding:10px 12px 12px; }
}

/* Opening the panel focuses its title for assistive technology, not interaction. */
#eclar-webchat #ew-title:focus { outline:none; }

/* Enrollment is part of the existing compact chat; personal data is never put in URLs/storage. */
#eclar-webchat .ew-contact-form{display:grid;gap:8px;padding:18px 20px;overflow:auto;min-height:0;flex:1;align-content:start}
#eclar-webchat .ew-contact-form h3{margin:0 0 8px;font-size:17px}
#eclar-webchat .ew-contact-form label{font-size:13px;font-weight:600}
#eclar-webchat .ew-contact-form input{font:inherit;width:100%;min-height:42px;padding:9px 11px;border:1px solid #c8ced8;border-radius:7px;background:#fff;color:#171719}
#eclar-webchat .ew-contact-form input:focus-visible{outline:3px solid #72adff;outline-offset:2px}
#eclar-webchat .ew-contact-form small,#eclar-webchat .ew-contact-form p{font-size:12px;line-height:1.5;color:#515968;margin:0 0 5px}
#eclar-webchat .ew-contact-form a{color:#0d55c8;text-decoration:underline}
#eclar-webchat .ew-start{padding:10px 14px;border:0;border-radius:7px;background:#1769e0;color:#fff;font-weight:600}
#eclar-webchat .ew-start:hover{background:#0d55c8}#eclar-webchat .ew-start:disabled{opacity:.6;cursor:wait}
@media(max-width:700px){#eclar-webchat .ew-contact-form input{font-size:16px}}

/* Minimal panel: one quiet header, neutral surfaces and fewer visual dividers. */
#eclar-webchat .ew-panel{border-color:#e8e8eb;border-radius:20px;box-shadow:0 16px 56px #15182024}
#eclar-webchat .ew-header{display:grid;grid-template-columns:40px minmax(0,1fr) auto 44px;gap:0 10px;padding:16px 18px;border-bottom:1px solid #f0f0f2}
#eclar-webchat .ew-avatar{grid-column:1;grid-row:1/span 2;align-self:center;width:40px;height:40px;border-radius:12px;font-size:27px}
#eclar-webchat .ew-heading{display:contents}
#eclar-webchat .ew-heading h2{grid-column:2;grid-row:1;align-self:center;font-size:17px;letter-spacing:-.4px}
#eclar-webchat .ew-heading p{grid-column:2/-1;grid-row:2;margin:1px 0 0;color:#6b6b74;font-size:11px;line-height:1.5}
#eclar-webchat .ew-sound{grid-column:3;grid-row:1;background:transparent;font-size:10px;padding:6px;color:#62626b}
#eclar-webchat .ew-close{grid-column:4;grid-row:1;background:transparent;color:#62626b}
#eclar-webchat .ew-close:hover,#eclar-webchat .ew-sound:hover{background:#f5f5f7}
#eclar-webchat .ew-messages{background:#fff;padding:22px 18px 12px}
#eclar-webchat .ew-message{border:0;border-radius:16px;background:#f4f4f6;padding:12px 14px}
#eclar-webchat .ew-message-visitor{background:#171719;color:#fff;border-radius:16px}
#eclar-webchat .ew-message-visitor .ew-sender{color:#d1d1da}
#eclar-webchat .ew-message p{line-height:1.6}
#eclar-webchat .ew-suggestions{background:#fff;padding:6px 18px 14px;gap:6px}
#eclar-webchat .ew-suggestions button{color:#52525c;border-color:#e5e5e9;background:#fff;min-height:40px}
#eclar-webchat .ew-suggestions button:hover{background:#f4f4f6}
#eclar-webchat .ew-form{border-top:0;padding:12px 16px 16px;background:#fff}
#eclar-webchat textarea{background:#f6f6f8;border-color:#e9e9ed;border-radius:14px}
#eclar-webchat .ew-send{border-radius:14px;background:#171719}
#eclar-webchat .ew-send:hover:not(:disabled),#eclar-webchat .ew-send:focus-visible:not(:disabled){background:var(--ew-blue)}
#eclar-webchat .ew-send:disabled{background:#f0f0f3;color:#93939d}
#eclar-webchat .ew-contact-form{padding:24px 20px;gap:10px}
#eclar-webchat .ew-contact-form h3{font-size:18px;letter-spacing:-.3px;margin-bottom:10px}
#eclar-webchat .ew-contact-form input{min-height:46px;border-color:#e1e1e7;border-radius:10px;background:#fafafb}
#eclar-webchat .ew-contact-form small,#eclar-webchat .ew-contact-form p{font-size:11px;color:#6b6b74;line-height:1.6}
#eclar-webchat .ew-start{min-height:46px;border-radius:10px;background:#171719;margin-top:4px}
#eclar-webchat .ew-start:hover:not(:disabled),#eclar-webchat .ew-start:focus-visible:not(:disabled){background:var(--ew-blue)}
@media(max-width:599px){#eclar-webchat .ew-header{padding:12px;gap:0 8px}#eclar-webchat .ew-form{padding:10px 12px 12px}}

/* Shared face for the launcher and compact header avatar. */
#eclar-webchat .ew-mascot-eyes{margin-bottom:8px}
#eclar-webchat .ew-mascot-mouth{position:absolute;left:50%;top:43px;width:14px;height:7px;border:0;border-bottom:2px solid #68cbff;border-radius:0 0 12px 12px;transform:translateX(-50%);box-shadow:0 2px 4px #1769e033;transition:width .25s,height .25s}
#eclar-webchat .ew-launcher:focus-visible .ew-mascot-mouth{width:18px;height:9px}
@media(hover:hover){#eclar-webchat .ew-launcher:hover .ew-mascot-mouth{width:18px;height:9px}}
#eclar-webchat .ew-avatar{background:transparent;border-radius:50%;gap:0}
#eclar-webchat .ew-avatar .ew-mascot{width:40px;height:40px;box-shadow:0 3px 9px #0002,inset 0 -2px 5px #0008;animation:none}
#eclar-webchat .ew-avatar .ew-mascot-eyes{gap:7px;margin-bottom:5px}
#eclar-webchat .ew-avatar .ew-mascot-eye{width:7px;height:12px;border-radius:5px}
#eclar-webchat .ew-avatar .ew-mascot-eye::after{width:2px;height:3px;top:2px;left:1px}
#eclar-webchat .ew-avatar .ew-mascot-mouth{top:27px;width:9px;height:5px;border-bottom-width:1.5px}
@media(prefers-reduced-motion:reduce){#eclar-webchat .ew-mascot-mouth{transition:none}}

/* Soft black jelly: a rounded silhouette deforms independently of its fixed hit area. */
#eclar-webchat .ew-launcher .ew-mascot{background:none;border:0;box-shadow:none;transform:none;animation:none;isolation:isolate}
#eclar-webchat .ew-launcher .ew-mascot::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 32% 22%,#27272d,#080809 65%);border:1px solid #33343c;border-radius:var(--ew-jelly-shape,50%);transform:translateY(var(--ew-jelly-y,0px)) scale(var(--ew-jelly-xscale,1),var(--ew-jelly-yscale,1));box-shadow:0 6px 16px #0003,inset 0 -3px 8px #0008;transition:border-color .25s}
#eclar-webchat .ew-launcher:hover .ew-mascot::before,#eclar-webchat .ew-launcher:focus-visible .ew-mascot::before{border-color:#1769e0}
@media(prefers-reduced-motion:reduce){#eclar-webchat .ew-launcher .ew-mascot::before{border-radius:50%;transform:none;transition:none}}

@media(prefers-reduced-motion:reduce){#eclar-webchat .ew-launcher-label{transform:none}}

/* Official response links remain legible and keyboard accessible. */
#eclar-webchat .ew-message p a{color:inherit;text-decoration:underline;text-underline-offset:3px;overflow-wrap:anywhere}
#eclar-webchat .ew-message p a:focus-visible{outline:2px solid #1769e0;outline-offset:3px;border-radius:2px}