:root{color-scheme:dark;--wa-bg: #12100c;--wa-panel: #1c1610;--wa-panel-2: #2a2118;--wa-bubble-out: #6b4520;--wa-bubble-in: #2a2118;--wa-text: #f2ebe3;--wa-text-secondary: #9a8b7a;--wa-blue: #5b8fa8;--wa-primary: #dd8933;--wa-danger: #f15c6d;--wa-border: rgba(154, 139, 122, .15)}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:var(--wa-bg);color:var(--wa-text);-webkit-font-smoothing:antialiased}.chat-app{display:grid;grid-template-rows:auto 1fr auto;height:100vh;height:100dvh;max-width:720px;margin:0 auto;background:var(--wa-bg);position:relative}@media (min-width: 768px){.chat-app{height:100vh;height:100dvh;border-left:1px solid var(--wa-border);border-right:1px solid var(--wa-border)}}.chat-header{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:var(--wa-panel);border-bottom:1px solid var(--wa-border);z-index:10}.header-left{display:flex;align-items:center;gap:12px;min-width:0}.back-link{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;color:var(--wa-text-secondary);text-decoration:none;flex-shrink:0;transition:background .15s}.back-link:hover{background:#ffffff0f}.header-avatar{flex-shrink:0;border-radius:50%;background:var(--wa-panel-2)}.header-info{min-width:0}.header-name{font-size:16px;font-weight:600;color:var(--wa-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.header-status{font-size:13px;color:var(--wa-text-secondary);display:flex;align-items:center;gap:5px}.header-status.online{color:var(--wa-text-secondary)}.status-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.status-dot.online{background:var(--wa-primary)}.status-dot.offline{background:var(--wa-text-secondary)}.status-dot.typing{background:var(--wa-blue);animation:pulse 1s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.header-right{position:relative}.menu-btn{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;border:0;background:transparent;color:var(--wa-text-secondary);cursor:pointer;transition:background .15s}.menu-btn:hover{background:#ffffff0f}.menu-dropdown{position:absolute;top:44px;right:0;background:var(--wa-panel-2);border:1px solid var(--wa-border);border-radius:10px;box-shadow:0 8px 24px #0006;overflow:hidden;min-width:160px;z-index:20}.menu-item{display:flex;align-items:center;gap:10px;width:100%;padding:12px 16px;border:0;background:transparent;color:var(--wa-text);font-size:14px;text-align:left;cursor:pointer;transition:background .15s}.menu-item:hover{background:#ffffff0f}.messages-area{overflow-y:auto;overflow-x:hidden;background:var(--wa-bg);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200' viewBox='0 0 200 200'%3E%3Cg fill='%23ffffff' fill-opacity='0.015'%3E%3Ccircle cx='40' cy='40' r='3'/%3E%3Ccircle cx='120' cy='80' r='2'/%3E%3Ccircle cx='80' cy='140' r='4'/%3E%3Ccircle cx='160' cy='160' r='2'/%3E%3Cpath d='M30 100c0-5 4-9 9-9s9 4 9 9-4 9-9 9-9-4-9-9z' fill='none' stroke='%23ffffff' stroke-opacity='0.015' stroke-width='1'/%3E%3C/g%3E%3C/svg%3E");position:relative;scroll-behavior:smooth}.messages-inner{display:flex;flex-direction:column;gap:4px;padding:16px 12px;min-height:100%;max-width:680px;margin:0 auto;width:100%}.message-wrap{position:relative;display:flex;max-width:85%}.message-wrap.user{align-self:flex-end;margin-left:auto}.message-wrap.bot,.message-wrap.error{align-self:flex-start}.message{position:relative;padding:8px 12px 6px;border-radius:10px;line-height:1.4;word-break:break-word;white-space:pre-wrap;max-width:100%}.message-wrap.user .message{background:var(--wa-bubble-out);border-top-right-radius:10px;border-bottom-right-radius:4px}.message-wrap.bot .message{background:var(--wa-bubble-in);border-top-left-radius:10px;border-bottom-left-radius:4px}.message-wrap.error .message{background:#f15c6d26;border:1px solid rgba(241,92,109,.4);border-radius:10px}.message-wrap.user .message:after{content:"";position:absolute;bottom:0;right:-7px;width:0;height:0;border:7px solid transparent;border-bottom-color:var(--wa-bubble-out);border-right:0;border-top:0}.message-wrap.bot .message:after{content:"";position:absolute;bottom:0;left:-7px;width:0;height:0;border:7px solid transparent;border-bottom-color:var(--wa-bubble-in);border-left:0;border-top:0}.message-text{font-size:14.5px;color:var(--wa-text)}.message-wrap.user .message-text{white-space:pre-wrap}.message-meta{display:flex;align-items:center;justify-content:flex-end;gap:4px;margin-top:2px;float:right;clear:both;margin-left:8px}.message-time{font-size:11px;color:var(--wa-text-secondary);line-height:1}.receipt{color:var(--wa-text-secondary);flex-shrink:0}.receipt-read{color:var(--wa-blue)}.copy-btn{position:absolute;top:4px;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:0;background:#0000004d;color:var(--wa-text-secondary);cursor:pointer;opacity:0;transition:opacity .15s,background .15s;z-index:5}.message-wrap.user .copy-btn{left:-36px}.message-wrap.bot .copy-btn,.message-wrap.error .copy-btn{right:-36px}.message-wrap:hover .copy-btn{opacity:1}.copy-btn:hover{background:#00000080;color:var(--wa-text)}.copy-btn.copied{opacity:1;color:var(--wa-primary)}.typing-bubble{align-self:flex-start;background:var(--wa-bubble-in);border-top-left-radius:10px;border-bottom-left-radius:4px;padding:12px 14px;position:relative}.typing-bubble:after{content:"";position:absolute;bottom:0;left:-7px;width:0;height:0;border:7px solid transparent;border-bottom-color:var(--wa-bubble-in);border-left:0;border-top:0}.typing-dots{display:flex;gap:4px;align-items:center}.typing-dots span{width:7px;height:7px;border-radius:50%;background:var(--wa-text-secondary);animation:typingBounce 1.4s infinite ease-in-out}.typing-dots span:nth-child(2){animation-delay:.2s}.typing-dots span:nth-child(3){animation-delay:.4s}@keyframes typingBounce{0%,60%,to{transform:translateY(0);opacity:.4}30%{transform:translateY(-5px);opacity:1}}.empty-state{margin:auto;text-align:center;padding:40px 20px;max-width:440px}.empty-logo{width:auto;max-width:280px;height:auto;max-height:70px;object-fit:contain;margin-bottom:16px}.empty-title{font-size:20px;font-weight:600;color:var(--wa-text);margin-bottom:8px}.empty-desc{font-size:14px;color:var(--wa-text-secondary);line-height:1.5;margin-bottom:24px}.quick-prompts{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}.quick-prompt{padding:9px 16px;border-radius:999px;border:1px solid var(--wa-border);background:var(--wa-panel-2);color:var(--wa-text);font-size:13px;cursor:pointer;transition:border-color .15s,background .15s}.quick-prompt:hover{border-color:var(--wa-primary);background:#00a8841a}.scroll-to-bottom{position:absolute;bottom:16px;right:16px;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:0;background:var(--wa-panel-2);color:var(--wa-text-secondary);cursor:pointer;box-shadow:0 2px 8px #0000004d;z-index:10;transition:background .15s}.scroll-to-bottom:hover{background:#3d3228}.skeleton-list{display:flex;flex-direction:column;gap:12px;padding:8px 0}.skeleton-bubble{border-radius:10px;padding:12px 14px;max-width:60%;background:var(--wa-bubble-in);animation:shimmer 1.5s infinite ease-in-out}.skeleton-bubble.left{align-self:flex-start;border-bottom-left-radius:4px}.skeleton-bubble.right{align-self:flex-end;background:var(--wa-bubble-out);border-bottom-right-radius:4px}.skeleton-line{height:10px;background:#ffffff14;border-radius:4px;margin-bottom:6px}.skeleton-line:last-child{margin-bottom:0}@keyframes shimmer{0%,to{opacity:.5}50%{opacity:1}}.composer{display:flex;align-items:flex-end;gap:8px;padding:10px 16px;background:var(--wa-panel);border-top:1px solid var(--wa-border)}.attach-btn{display:grid;place-items:center;width:42px;height:42px;flex-shrink:0;border-radius:50%;border:0;background:transparent;color:var(--wa-text-secondary);cursor:pointer;transition:background .15s}.attach-btn:hover{background:#ffffff0f}.composer-input{flex:1;resize:none;border:0;border-radius:12px;padding:10px 14px;background:var(--wa-panel-2);color:var(--wa-text);font-family:inherit;font-size:14.5px;line-height:1.4;outline:none;max-height:140px;overflow-y:auto}.composer-input::placeholder{color:var(--wa-text-secondary)}.composer-input:focus{outline:none}.composer-input:disabled{opacity:.5}.send-btn{display:grid;place-items:center;width:42px;height:42px;flex-shrink:0;border-radius:50%;border:0;background:var(--wa-primary);color:#fff;cursor:pointer;transition:opacity .15s,transform .1s}.send-btn:hover:not(:disabled){opacity:.9}.send-btn:active:not(:disabled){transform:scale(.95)}.send-btn:disabled{background:var(--wa-panel-2);color:var(--wa-text-secondary);cursor:not-allowed}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;display:grid;place-items:center;z-index:100;padding:20px}.name-modal{background:var(--wa-panel-2);border-radius:16px;padding:32px 28px;max-width:360px;width:100%;text-align:center;box-shadow:0 24px 60px #00000080}.name-modal-logo{display:flex;justify-content:center;margin-bottom:16px}.name-modal-logo img{width:auto;max-width:240px;height:auto;max-height:60px;object-fit:contain}.name-modal-title{font-size:20px;font-weight:700;color:var(--wa-text);margin-bottom:8px}.name-modal-desc{font-size:14px;color:var(--wa-text-secondary);margin-bottom:24px}.name-modal-input{width:100%;border:1px solid var(--wa-border);border-radius:10px;padding:12px 14px;background:var(--wa-bg);color:var(--wa-text);font-family:inherit;font-size:15px;outline:none;margin-bottom:16px}.name-modal-input:focus{border-color:var(--wa-primary)}.name-modal-btn{width:100%;border:0;border-radius:10px;padding:12px;background:var(--wa-primary);color:#fff;font-family:inherit;font-size:15px;font-weight:600;cursor:pointer;transition:opacity .15s}.name-modal-btn:hover:not(:disabled){opacity:.9}.name-modal-btn:disabled{opacity:.5;cursor:not-allowed}.message.bot .message-text p{margin:0 0 8px}.message.bot .message-text p:last-child{margin-bottom:0}.message.bot .message-text strong{color:var(--wa-blue);font-weight:700}.message.bot .message-text ul,.message.bot .message-text ol{margin:6px 0;padding-left:20px}.message.bot .message-text li{margin:3px 0}.message.bot .message-text code{background:#0000004d;padding:1px 5px;border-radius:4px;font-size:13px}.message.bot .message-text pre{background:#0000004d;border-radius:8px;padding:10px 12px;overflow-x:auto;margin:8px 0}.message.bot .message-text pre code{background:none;padding:0}.message.bot .message-text h1,.message.bot .message-text h2,.message.bot .message-text h3{margin:10px 0 6px;font-size:15px;color:var(--wa-blue)}.message.bot .message-text blockquote{border-left:3px solid var(--wa-blue);padding-left:10px;margin:8px 0;color:var(--wa-text-secondary)}.message.bot .message-text a{color:var(--wa-blue);text-decoration:underline}.message.bot .message-text table{border-collapse:collapse;margin:8px 0;font-size:13px;width:100%}.message.bot .message-text th,.message.bot .message-text td{border:1px solid var(--wa-border);padding:6px 10px;text-align:left}.message.bot .message-text th{background:#ffffff0f;font-weight:700}@media (max-width: 640px){.message-wrap{max-width:88%}.messages-inner{padding:12px 8px}.chat-header,.composer{padding:8px 12px}.copy-btn{display:none}}