:root{--wa-header:#008069;--wa-send:#00a884;--wa-out-bubble:#d9fdd3;--wa-in-bubble:#fff;--wa-panel:#f0f2f5;--wa-text:#111b21;--wa-muted:#667781}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}body,html{height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background:#d1d7db}.app-shell{align-items:center;justify-content:center;background:linear-gradient(180deg,#008069,#008069 64px,#d9dbd4 0)}.app-shell,.phone{width:100%;height:100vh;height:100dvh;display:flex}.phone{position:relative;max-width:480px;max-height:900px;flex-direction:column;background:#efeae2;overflow:hidden;box-shadow:0 12px 40px rgba(0,0,0,.25)}@media (min-width:520px){.phone{border-radius:14px;height:min(900px,94vh);height:min(900px,94dvh)}}.wa-header{gap:8px;background:var(--wa-header);padding:max(8px,env(safe-area-inset-top)) 10px 8px;flex-shrink:0;z-index:2}.wa-header,.wa-header button{display:flex;align-items:center;color:#fff}.wa-header button{background:none;border:none;padding:0;cursor:pointer;justify-content:center;min-width:44px;min-height:44px;margin:-6px 0}.hdr-back{margin:-6px 2px -6px -8px;min-width:34px}.wa-avatar{width:40px;height:40px;border-radius:50%;background:#d5efd6;color:#12864b;display:flex;align-items:center;justify-content:center;flex-shrink:0;overflow:hidden}.wa-avatar svg{transform:translateX(-1px)}.wa-header-info{flex:1 1;min-width:0;margin-left:2px}.wa-header-info .name{font-size:16.5px;font-weight:600;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wa-header-info .status{font-size:12.5px;opacity:.85;line-height:1.2}.wa-header-icons{display:flex;align-items:center;gap:4px}.wa-header-icons button{opacity:.96}.wa-chat{flex:1 1;overflow-y:auto;padding:14px 8px 8px;display:flex;flex-direction:column;gap:3px;background-color:#efeae2;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='84' height='84' viewBox='0 0 84 84'%3E%3Cg fill='none' stroke='%23d3ccbf' stroke-width='1.2' stroke-linecap='round' opacity='0.5'%3E%3Ccircle cx='12' cy='11' r='2.4'/%3E%3Cpath d='M29 8 q5 4 0 9'/%3E%3Cpath d='M50 13 l7 0 M53.5 9.5 l0 7'/%3E%3Ccircle cx='72' cy='14' r='1.7'/%3E%3Cpath d='M7 35 q6 -6 12 0'/%3E%3Ccircle cx='40' cy='31' r='2.1'/%3E%3Ccircle cx='63' cy='33' r='3.2'/%3E%3Cpath d='M17 57 l0 7 M13.5 60.5 l7 0'/%3E%3Ccircle cx='44' cy='55' r='2.4'/%3E%3Cpath d='M66 53 q5 4 0 9'/%3E%3Cpath d='M9 77 q5 -5 10 0'/%3E%3Ccircle cx='36' cy='75' r='1.7'/%3E%3Cpath d='M57 73 l7 0 M60.5 69.5 l0 7'/%3E%3Ccircle cx='78' cy='42' r='2.1'/%3E%3C/g%3E%3C/svg%3E")}.wa-chat:focus-visible{outline:2px solid var(--wa-header);outline-offset:-2px}.wa-notice{max-width:90%;text-align:center;background:#ffeecd;color:#54656f;line-height:1.4;padding:6px 12px;margin:2px 0 8px}.wa-day,.wa-notice{align-self:center;font-size:12px;border-radius:8px;box-shadow:0 1px .5px rgba(0,0,0,.13)}.wa-day{background:#fff;color:var(--wa-muted);padding:5px 12px;margin:6px 0 10px}.bubble{position:relative;max-width:78%;padding:6px 9px 8px;border-radius:8px;font-size:14.6px;line-height:1.35;color:var(--wa-text);box-shadow:0 1px .5px rgba(0,0,0,.13);word-wrap:break-word;overflow-wrap:break-word;white-space:pre-wrap;margin-top:2px;animation:pop .18s cubic-bezier(.22,1,.36,1)}@keyframes pop{0%{transform:translateY(6px);opacity:0}to{transform:none;opacity:1}}.bubble.in{align-self:flex-start;background:var(--wa-in-bubble);border-top-left-radius:0;margin-left:8px}.bubble.out{align-self:flex-end;background:var(--wa-out-bubble);border-top-right-radius:0;margin-right:8px}.bubble.in:before{left:-8px;background:var(--wa-in-bubble);-webkit-clip-path:polygon(100% 0,100% 100%,0 0);clip-path:polygon(100% 0,100% 100%,0 0)}.bubble.in:before,.bubble.out:before{content:"";position:absolute;top:0;width:8px;height:13px}.bubble.out:before{right:-8px;background:var(--wa-out-bubble);-webkit-clip-path:polygon(0 0,0 100%,100% 0);clip-path:polygon(0 0,0 100%,100% 0)}.bubble .time{font-size:11px;color:rgba(17,27,33,.5);float:right;margin:7px 0 -2px 10px;-webkit-user-select:none;-moz-user-select:none;user-select:none;display:inline-flex;align-items:center;gap:3px;white-space:nowrap}.bubble.out .time{color:#40564c}.bubble .time .tick{color:#53bdeb;margin-bottom:-1px}.typing{align-self:flex-start;background:#fff;border-radius:8px;border-top-left-radius:0;padding:12px 14px;margin:2px 0 0 8px;display:flex;gap:4px;box-shadow:0 1px .5px rgba(0,0,0,.13)}.typing span{width:7px;height:7px;border-radius:50%;background:#9aa4ab;animation:blink 1.3s ease-in-out infinite}.typing span:nth-child(2){animation-delay:.2s}.typing span:nth-child(3){animation-delay:.4s}@keyframes blink{0%,60%,to{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}.wa-input{gap:7px;padding:8px 8px max(8px,env(safe-area-inset-bottom));background:var(--wa-panel);flex-shrink:0;width:100%;max-width:100%}.wa-input,.wa-input .field{display:flex;align-items:flex-end}.wa-input .field{flex:1 1 auto;min-width:0;background:#fff;border-radius:24px;padding:3px 6px;gap:2px;min-height:48px}.wa-input textarea{flex:1 1 auto;min-width:0;border:none;outline:none;resize:none;font-size:16px;font-family:inherit;max-height:96px;line-height:1.4;padding:11px 4px;background:transparent;color:var(--wa-text)}.ic-btn{background:none;border:none;padding:9px;color:#54656f;display:flex;align-items:center;justify-content:center;flex-shrink:0;cursor:pointer}.ic-btn:active{opacity:.6}.wa-send{width:48px;height:48px;border-radius:50%;border:none;background:var(--wa-send);color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:transform .12s ease,background .2s ease}.wa-send .send-ic{margin-left:3px}.wa-send:active{transform:scale(.9)}.wa-send:disabled{opacity:.7;cursor:default}@media (max-width:380px){.ic-cam{display:none}.wa-header-info .name{font-size:16px}}