:root{color:#26323f;background:#eef3f9;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html,body,#app{height:100%;margin:0;overflow:hidden}button,input,textarea{font:inherit}button{cursor:pointer}button:disabled,textarea:disabled{cursor:not-allowed;opacity:.56}.chat-shell{height:100vh;height:100dvh;overflow:hidden;background:#eef3f9}.chat-panel{position:relative;display:flex;height:100vh;height:100dvh;max-width:520px;margin:0 auto;overflow:hidden;flex-direction:column;background:#eef3f9}.chat-header{position:sticky;top:0;z-index:4;display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;padding:16px 14px 12px;background:#eef3f9f0;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.history-pill,.system-pill,.ended-pill,.time-divider{border-radius:999px;box-shadow:0 8px 22px #475d7417}.history-pill{display:inline-flex;align-items:center;justify-self:center;gap:8px;min-height:42px;padding:0 18px;border:0;color:#2377b8;background:#fff}.header-actions{display:inline-flex;gap:6px}.header-icon,.icon-button,.field-icon{display:inline-flex;align-items:center;justify-content:center;border:0;color:#119fd1;background:transparent}.header-icon{width:38px;height:38px;border-radius:50%;background:#ffffffb8}.message-list{display:flex;min-height:0;height:100%;margin:0;padding:12px 14px 118px;overflow-y:auto;overscroll-behavior:contain;flex:1;flex-direction:column;gap:18px;list-style:none}.timeline-item{display:block}.time-divider{display:table;margin:0 auto;padding:7px 12px;color:#7b8794;font-size:12px;background:#fffc}.message-row{display:flex;align-items:flex-end;gap:10px}.message-row--system{justify-content:center}.message-row--visitor{justify-content:flex-end}.message-row--agent{justify-content:flex-start}.system-pill{width:min(100%,440px);padding:11px 16px;text-align:center;color:#334155;line-height:1.5;background:#fffffff5}.ended-pill{color:#fff;background:#85888b;box-shadow:none}.message-stack{display:flex;min-width:0;max-width:calc(100% - 58px);flex-direction:column;align-items:flex-start;gap:6px}.message-stack--visitor{align-items:flex-end}.message-bubble{display:inline-flex;min-height:44px;min-width:0;max-width:min(72vw,350px);padding:12px 16px;align-items:center;gap:8px;overflow-wrap:anywhere;line-height:1.48;text-align:left;white-space:pre-wrap;border:0;border-radius:20px;text-decoration:none}.message-emoji{display:inline-block;width:28px;height:28px;flex:0 0 auto;vertical-align:middle}.message-bubble--visitor{color:#fff;background:#18bdd1;border-top-right-radius:8px}.message-bubble--agent{color:#18202a;background:#fff;box-shadow:0 6px 16px #4254681c;border-top-left-radius:8px}.message-bubble--image{padding:4px;overflow:hidden;background:transparent}.message-bubble--image img{display:block;max-width:min(64vw,260px);max-height:240px;border-radius:16px;object-fit:cover}.message-file{color:inherit;cursor:pointer;font:inherit;min-width:0}.message-file span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.message-voice audio{width:min(190px,52vw);height:32px}.message-video{display:block;padding:6px;overflow:hidden;background:transparent}.message-video__player{display:block;width:min(66vw,300px);max-height:260px;border-radius:12px;background:#111827}.message-location{max-width:min(70vw,300px)}.message-status{color:#8c98a5;font-size:12px}.avatar{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;width:38px;height:38px;overflow:hidden;border-radius:50%}.avatar img{width:100%;height:100%;object-fit:cover}.avatar--visitor{color:#fff;background:#12acd7}.avatar--agent{color:#fff;font-weight:700;background:#2f8dc7;box-shadow:0 3px 10px #2f8dc742}.agent-name{color:#5d6b7a;font-size:13px}.composer{position:fixed;right:0;bottom:0;left:0;z-index:5;display:grid;grid-template-columns:44px minmax(0,1fr) 48px;gap:8px;width:min(100%,520px);margin:0 auto;padding:10px 12px calc(10px + env(safe-area-inset-bottom));border-top:1px solid rgba(173,184,197,.28);background:#f7f9fcf7;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.icon-button{width:44px;height:44px;border-radius:50%}.icon-button--send{color:#fff;background:#119fd1}.send-label{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0)}.composer-field{display:grid;grid-template-columns:minmax(0,1fr) 36px 36px;min-width:0;min-height:44px;padding:4px 5px 4px 14px;align-items:center;border-radius:999px;background:#fff}.composer-field textarea{width:100%;min-width:0;max-height:88px;resize:none;border:0;outline:0;color:#1f2937;line-height:1.4;background:transparent}.field-icon{width:34px;height:34px;flex:0 0 auto;border-radius:50%}.action-panel{position:fixed;right:0;bottom:calc(64px + env(safe-area-inset-bottom));left:0;z-index:4;width:min(100%,520px);max-height:min(42vh,280px);margin:0 auto;padding:14px;overflow-y:auto;border-top:1px solid rgba(173,184,197,.28);background:#fffffffa;box-shadow:0 -10px 24px #475d7414}.action-grid{display:grid;grid-template-columns:repeat(4,minmax(58px,1fr));gap:10px}.action-grid button,.emoji-panel button,.question-panel button{border:0;color:#2d3b49;background:#f3f6fa;border-radius:8px}.action-grid button{display:inline-flex;min-width:0;min-height:72px;align-items:center;justify-content:center;flex-direction:column;gap:7px;font-size:13px}.emoji-panel{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}.emoji-panel button{display:inline-flex;min-height:42px;padding:4px;align-items:center;justify-content:center}.emoji-panel img{width:28px;height:28px;object-fit:contain}.question-panel{display:flex;flex-direction:column;gap:8px}.question-panel button{min-height:42px;padding:0 12px;text-align:left}.panel-empty{margin:0;padding:12px;color:#64748b;text-align:center}.chat-state{display:grid;min-height:280px;padding:24px;place-items:center;color:#64748b;text-align:center}.chat-state--error{color:#b42318}.chat-state button,.primary-button,.secondary-button{min-height:40px;padding:0 16px;border-radius:999px}.chat-state button,.primary-button{border:0;color:#fff;background:#119fd1}.secondary-button{border:1px solid #cbd5e1;color:#334155;background:#fff}.dialog-backdrop,.preview-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10;display:grid;place-items:center;padding:22px;background:#0f172a6b}.dialog-panel{display:flex;width:min(100%,380px);padding:20px;flex-direction:column;gap:12px;border-radius:8px;background:#fff;box-shadow:0 20px 48px #0f172a38}.dialog-panel h2{margin:0;font-size:18px}.dialog-panel input,.dialog-panel textarea{width:100%;border:1px solid #d6dee8;border-radius:8px;padding:10px 12px;outline:0}.dialog-actions{display:flex;justify-content:flex-end;gap:10px}.rating-stars{display:flex;gap:4px}.rating-list{display:flex;flex-direction:column;gap:10px}.rating-row{display:grid;grid-template-columns:minmax(72px,1fr) auto;gap:10px;align-items:center;color:#334155}.rating-stars button{width:38px;height:38px;border:0;color:#cbd5e1;font-size:24px;background:transparent}.rating-stars button.active{color:#f5a524}.preview-backdrop{background:#0f172ad1}.preview-backdrop img{max-width:min(100%,920px);max-height:86vh;border-radius:8px;object-fit:contain}.preview-close{position:fixed;top:16px;right:18px;width:40px;height:40px;border:0;color:#fff;font-size:30px;line-height:1;background:transparent}.hidden-input{display:none}.icon-button:focus-visible,.field-icon:focus-visible,.history-pill:focus-visible,.header-icon:focus-visible,.action-panel button:focus-visible,.chat-state button:focus-visible,.primary-button:focus-visible,.secondary-button:focus-visible{outline:2px solid #119fd1;outline-offset:2px}.error-shell{display:grid;min-height:100vh;place-items:center;padding:24px;background:#eef3f9}.error-panel{width:min(100%,420px);padding:28px;text-align:center;border-radius:8px;background:#fff;box-shadow:0 12px 30px #485b701f}.error-title{margin:0 0 10px;color:#26323f;font-size:20px;font-weight:700}.error-copy{margin:0 0 20px;color:#64748b;line-height:1.6}.error-link{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 18px;color:#fff;text-decoration:none;border-radius:999px;background:#119fd1}@media (min-width: 560px){.chat-shell{height:100vh;height:100dvh;padding:24px 0}.chat-panel{height:calc(100vh - 48px);height:calc(100dvh - 48px);border-radius:8px;box-shadow:0 18px 42px #475d7424}.composer,.action-panel{right:auto;left:50%;transform:translate(-50%)}.composer{border-radius:0 0 8px 8px}}