.chat-message{display:flex;align-items:flex-start;gap:8px;padding:2px 16px;animation:msg-in .2s ease-out both}.chat-message.agent{flex-direction:row-reverse}.chat-message+.chat-message{margin-top:4px}.cm-avatar{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:600;flex-shrink:0;margin-top:20px;-webkit-user-select:none;user-select:none}.chat-message.agent .cm-avatar{background:var(--color-background-info);color:var(--color-text-info)}.chat-message.caller .cm-avatar{background:var(--color-background-secondary);color:var(--color-text-secondary)}.cm-body{display:flex;flex-direction:column;gap:3px;max-width:70%}.chat-message.agent .cm-body{align-items:flex-end}.chat-message.caller .cm-body{align-items:flex-start}.cm-sender{font-size:11px;font-weight:500;letter-spacing:.02em;padding:0 4px}.chat-message.agent .cm-sender{color:var(--color-text-info);opacity:.8}.chat-message.caller .cm-sender{color:var(--color-text-secondary);opacity:.8}.cm-bubble{padding:9px 13px;word-break:break-word}.chat-message.agent .cm-bubble{background:var(--color-background-info);border:1px solid #dbeafe;border-radius:16px 16px 4px;color:var(--color-text-info)}.chat-message.caller .cm-bubble{background:var(--color-background-secondary);border:1px solid var(--color-border-primary);border-radius:16px 16px 16px 4px;color:var(--color-text-primary)}.cm-text{font-size:13.5px;line-height:1.55}.cm-translation{display:flex;align-items:flex-start;gap:6px;padding:5px 10px;border-left:2px solid var(--color-border-tertiary);margin-left:4px;opacity:.6;animation:msg-in .2s .15s ease-out both}.chat-message.agent .cm-translation{border-left:none;border-right:2px solid var(--color-border-tertiary);margin-left:0;margin-right:4px;flex-direction:row-reverse}.cm-translation-arrow{font-size:11px;color:var(--color-text-tertiary);flex-shrink:0;margin-top:1px}.cm-translation-text{font-size:13px;font-style:italic;line-height:1.5;color:var(--color-text-secondary);word-break:break-word}.cm-time{font-size:11px;color:var(--color-text-tertiary);padding:0 4px}@media(prefers-reduced-motion:reduce){.chat-message,.cm-translation{animation:none;opacity:1;transform:none}}@media(max-width:600px){.cm-body{max-width:85%}}.copy-btn{position:absolute;top:8px;right:8px;display:flex;align-items:center;justify-content:center;width:26px;height:26px;padding:0;border:none;border-radius:6px;background:transparent;color:var(--color-text-tertiary);cursor:pointer;transition:background .15s ease,color .15s ease,transform .1s ease;flex-shrink:0}.copy-btn:hover{background:var(--color-background-secondary);color:var(--color-text-primary)}.copy-btn:active{transform:scale(.97)}.copy-btn--copied{color:var(--color-text-success)}.copy-btn:focus-visible{outline:none;box-shadow:var(--focus-ring)}.call-summary{display:flex;flex-direction:column;height:100%;background:var(--color-background-primary);border-radius:10px;border:1px solid var(--color-border-primary);overflow:hidden;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.cs-header{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:.5px solid var(--color-border-tertiary);flex-shrink:0}.cs-header-left{display:flex;align-items:center;gap:10px}.cs-title{font-size:14px;font-weight:600;color:var(--color-text-primary);letter-spacing:-.01em}.cs-call-id{font-size:11px;color:var(--color-text-tertiary);background:var(--color-background-secondary);padding:2px 7px;border-radius:4px;font-family:Menlo,Monaco,monospace}.cs-header-right{display:flex;align-items:center;gap:10px}.cs-ended{font-size:12px;color:var(--color-text-tertiary)}.cs-btn-close{height:28px;padding:0 12px;border:1px solid var(--color-border-primary);border-radius:6px;background:var(--color-background-primary);color:var(--color-text-secondary);font-size:12.5px;font-family:inherit;font-weight:500;cursor:pointer;transition:background .15s,border-color .15s}.cs-btn-close:hover{background:var(--color-background-secondary);border-color:var(--color-border-secondary)}.cs-btn-close:focus-visible{box-shadow:var(--focus-ring)}.cs-meta-bar{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;border-bottom:.5px solid var(--color-border-tertiary);background:var(--color-background-tertiary);gap:12px;flex-shrink:0;flex-wrap:wrap}.cs-meta-chips{display:flex;align-items:center;gap:16px;flex-wrap:wrap}.cs-chip{display:flex;align-items:center;gap:5px;font-size:12.5px;color:var(--color-text-primary);font-weight:500}.cs-chip svg{color:var(--color-text-tertiary);flex-shrink:0}.cs-chip-label{font-size:11px;font-weight:500;color:var(--color-text-tertiary);text-transform:uppercase;letter-spacing:.04em}.cs-downloads{display:flex;gap:6px;flex-shrink:0}.cs-btn-download{height:28px;padding:0 12px;border-radius:6px;font-size:12.5px;font-family:inherit;font-weight:500;cursor:pointer;transition:background .15s,border-color .15s;border:1px solid var(--color-text-primary);background:var(--color-text-primary);color:#fff}.cs-btn-download:hover{background:#27272a;border-color:#27272a}.cs-btn-download:focus-visible{box-shadow:var(--focus-ring)}.cs-btn-download-ghost{background:var(--color-background-primary);color:var(--color-text-primary)}.cs-btn-download-ghost:hover{background:var(--color-background-secondary)}.cs-body{flex:1;display:grid;grid-template-columns:40% 1fr;gap:0;overflow:hidden;min-height:0}.cs-form{border-right:.5px solid var(--color-border-tertiary);padding:16px 20px;overflow-y:auto;display:flex;flex-direction:column;gap:14px}.cs-transcript{display:flex;flex-direction:column;overflow:hidden;min-width:0}.cs-transcript-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px 8px;flex-shrink:0;border-bottom:.5px solid var(--color-border-tertiary)}.cs-transcript-count{font-size:11px;color:var(--color-text-tertiary)}.cs-transcript-scroll{flex:1;overflow-y:auto;padding:8px 0}.cs-transcript-empty{padding:24px 16px;font-size:13px;color:var(--color-text-tertiary);text-align:center}.cs-field{display:flex;flex-direction:column;gap:6px}.cs-field-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-primary);margin-bottom:2px}.cs-box{position:relative;background:var(--color-background-primary);border:.5px solid var(--color-border-tertiary);border-radius:12px;padding:12px}.cs-box--sentiment{padding:10px 12px;min-height:44px;display:flex;align-items:center}.cs-textarea{width:100%;resize:none;overflow:hidden;padding:0 32px 0 0;border:none;outline:none;background:transparent;font-family:inherit;font-size:13px;line-height:1.55;color:var(--color-text-primary);box-sizing:border-box;display:block}.cs-textarea::placeholder{color:var(--color-text-tertiary)}.cs-box:focus-within{border-color:var(--color-border-info);box-shadow:0 0 0 3px #2563eb14}.cs-sentiment-pill{display:inline-flex;align-items:center;padding:4px 10px;border-radius:20px;font-size:13px;font-weight:500;border:1px solid}.cs-footer{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;border-top:.5px solid var(--color-border-tertiary);background:var(--color-background-tertiary);flex-shrink:0;position:sticky;bottom:0}.cs-unsaved{font-size:12px;color:var(--color-text-warning);font-weight:500;min-height:16px}.cs-footer-actions{display:flex;gap:8px}.cs-btn-ghost{height:32px;padding:0 14px;border:1px solid var(--color-border-primary);border-radius:7px;background:var(--color-background-primary);color:var(--color-text-secondary);font-size:13px;font-family:inherit;font-weight:500;cursor:pointer;transition:background .15s,border-color .15s}.cs-btn-ghost:hover:not(:disabled){background:var(--color-background-secondary);border-color:var(--color-border-secondary)}.cs-btn-ghost:disabled{opacity:.4;cursor:not-allowed}.cs-btn-ghost:focus-visible{box-shadow:var(--focus-ring)}.cs-btn-primary{height:32px;padding:0 16px;border:none;border-radius:7px;background:var(--color-text-primary);color:#fff;font-size:13px;font-family:inherit;font-weight:500;cursor:pointer;transition:background .15s,transform .1s}.cs-btn-primary:hover{background:#27272a}.cs-btn-primary:active{transform:scale(.97)}.cs-btn-primary:focus-visible{box-shadow:var(--focus-ring)}.cs-transcript-scroll .chat-message{padding:2px 12px}@media(max-width:900px){.cs-body{grid-template-columns:1fr;grid-template-rows:auto 1fr}.cs-form{border-right:none;border-bottom:.5px solid var(--color-border-tertiary);max-height:55vh}.cs-transcript{max-height:40vh}}.speaking-indicator{display:flex;align-items:center;gap:8px;padding:4px 16px 10px;animation:msg-in .2s ease-out both}.speaking-indicator.agent{flex-direction:row-reverse}.speaking-avatar{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:600;flex-shrink:0}.speaking-avatar.agent{background:var(--color-background-info);color:var(--color-text-info)}.speaking-avatar.caller{background:var(--color-background-secondary);color:var(--color-text-secondary)}.speaking-dots{display:flex;align-items:center;gap:4px;background:var(--color-background-primary);border:1px solid var(--color-border-primary);border-radius:16px 16px 16px 4px;padding:8px 12px;width:52px;justify-content:center;transition:border-color .2s,box-shadow .2s}.speaking-indicator.agent .speaking-dots{border-radius:16px 16px 4px;border-color:#2563eb59;box-shadow:0 0 0 3px #2563eb14}.speaking-indicator.caller .speaking-dots{border-color:var(--color-border-secondary);box-shadow:0 0 0 3px #71717a12}.dot{width:7px;height:7px;border-radius:50%;animation:bounce-dot 1.4s infinite ease-in-out}.speaking-indicator.agent .dot{background:var(--color-text-info)}.speaking-indicator.caller .dot{background:var(--color-text-secondary)}.dot:nth-child(1){animation-delay:0ms}.dot:nth-child(2){animation-delay:.15s}.dot:nth-child(3){animation-delay:.3s}@keyframes bounce-dot{0%,60%,to{transform:translateY(0);opacity:.45}30%{transform:translateY(-5px);opacity:1}}@keyframes msg-in{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.speaking-indicator{animation:none}.dot{animation:none;opacity:.6}}.chat-page{height:100vh;display:flex;flex-direction:column;background:var(--color-background-tertiary);position:relative}.toast-message{position:fixed;top:14px;right:14px;z-index:2000;min-width:200px;max-width:320px;padding:10px 14px;border-radius:8px;color:#fff;font-size:13px;font-weight:500;box-shadow:0 4px 12px #0000001f;animation:toast-in .2s ease-out}.toast-success{background:var(--color-text-success)}.toast-error{background:var(--color-text-error)}@keyframes toast-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.chat-header{background:var(--color-background-primary);border-bottom:.5px solid var(--color-border-tertiary);padding:0 16px;height:48px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-shrink:0;font-size:12px;color:var(--color-text-secondary);position:relative}.ch-left{display:flex;align-items:center;flex:1;min-width:0;overflow:hidden}.ch-divider{width:.5px;height:18px;background:var(--color-border-tertiary);margin:0 14px;flex-shrink:0}.ch-section{display:flex;align-items:center;gap:6px;position:relative}.ch-icon{color:var(--color-text-tertiary)}.ch-title{font-size:13px;font-weight:600;color:var(--color-text-primary);letter-spacing:-.01em}.ch-status-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0}.ch-status-dot.connected{background:var(--color-text-success);animation:pulse-dot 2s infinite}.ch-status-dot.connecting{background:var(--color-text-warning)}.ch-status-dot.disconnected{background:var(--color-text-error);animation:shake-dot .5s ease}@keyframes pulse-dot{0%,to{box-shadow:0 0 #16a34a66}50%{box-shadow:0 0 0 4px #16a34a00}}@keyframes shake-dot{0%,to{transform:translate(0)}25%{transform:translate(-2px)}75%{transform:translate(2px)}}.ch-status-text{font-size:12px;color:var(--color-text-secondary)}.ch-conv-id{display:flex;align-items:center;gap:5px;padding:3px 8px;border:none;background:none;border-radius:5px;font-size:12px;font-family:inherit;color:var(--color-text-secondary);cursor:pointer;transition:background .15s}.ch-conv-id:hover{background:var(--color-background-secondary)}.ch-conv-id-text{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:Menlo,Monaco,monospace;font-size:11px}.ch-conn-details{position:absolute;top:calc(100% + 8px);left:0;z-index:100;background:var(--color-background-primary);border:1px solid var(--color-border-primary);border-radius:8px;padding:10px 14px;min-width:320px;box-shadow:0 4px 16px #00000014;display:flex;flex-direction:column;gap:6px}.ch-conn-row{display:flex;gap:8px;font-size:11.5px;align-items:baseline}.ch-conn-row span{color:var(--color-text-tertiary);flex-shrink:0;width:72px}.ch-conn-row code{color:var(--color-text-primary);font-size:11px;word-break:break-all}.ch-acw-btn{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border:none;border-radius:8px;background:var(--color-text-primary);color:#fff;font-size:12.5px;font-family:inherit;font-weight:500;cursor:pointer;transition:background .15s,transform .1s;white-space:nowrap;flex-shrink:0}.ch-acw-btn:hover{background:#27272a}.ch-acw-btn:active{transform:scale(.97)}.ch-acw-btn:focus-visible{box-shadow:var(--focus-ring)}.chat-content{flex:1;padding:12px;overflow:hidden;position:relative;display:flex}.call-summary-overlay{position:absolute;inset:0;background:var(--color-background-tertiary);z-index:10;padding:12px;overflow-y:auto;display:flex}.call-summary-overlay .call-summary{flex:1;margin:0}.chat-messages{flex:1;background:var(--color-background-primary);border-radius:10px;border:1px solid var(--color-border-primary);display:flex;flex-direction:column;overflow:hidden}.messages-header{padding:8px 12px;border-bottom:.5px solid var(--color-border-tertiary);display:flex;justify-content:space-between;align-items:center;flex-shrink:0;background:var(--color-background-tertiary);border-radius:10px 10px 0 0}.mh-left{display:flex;align-items:center;gap:7px}.mh-title{font-size:12.5px;font-weight:500;color:var(--color-text-secondary)}.mh-count-badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:18px;padding:0 5px;background:var(--color-background-secondary);border-radius:9px;font-size:11px;font-weight:600;color:var(--color-text-secondary);transition:transform .25s cubic-bezier(.34,1.56,.64,1)}.mh-count-badge.bump{transform:scale(1.15)}.controls{display:flex;align-items:center;gap:6px}.ctrl-lang-box{display:flex;align-items:center;height:32px;border:1px solid var(--color-border-primary);border-radius:8px;background:var(--color-background-primary);overflow:hidden;transition:border-color .15s}.ctrl-lang-box:focus-within{border-color:var(--color-border-info)}.ctrl-lang-box:hover:not(:focus-within):not(.has-lang){border-color:var(--color-border-secondary)}.ctrl-lang-box.has-lang{border-color:var(--color-border-secondary)}.ctrl-lang-select-wrap{position:relative;display:flex;align-items:center;height:100%;padding-left:9px;padding-right:18px;gap:5px}.ctrl-lang-select-wrap:after{content:"";position:absolute;right:7px;top:50%;transform:translateY(-50%);width:0;height:0;border-left:3.5px solid transparent;border-right:3.5px solid transparent;border-top:3.5px solid var(--color-text-tertiary);pointer-events:none}.ctrl-lang-icon{color:var(--color-text-tertiary);flex-shrink:0}.ctrl-lang-select{height:100%;padding:0 4px 0 0;border:none;background:transparent;color:var(--color-text-primary);font-size:12.5px;font-family:inherit;font-weight:500;cursor:pointer;outline:none;appearance:none;min-width:116px}.ctrl-lang-select.is-placeholder{color:var(--color-text-tertiary)}.ctrl-lang-select:disabled{opacity:.45;cursor:not-allowed}.ctrl-disclaimer-box{display:inline-flex;align-items:center;gap:5px;height:32px;padding:0 11px;border:1px solid var(--color-border-primary);border-radius:8px;background:var(--color-background-primary);color:var(--color-text-tertiary);font-size:12.5px;font-family:inherit;font-weight:500;cursor:default;transition:background .15s,color .15s,border-color .15s;white-space:nowrap}.ctrl-disclaimer-box.ready{color:var(--color-text-primary);border-color:var(--color-border-secondary);cursor:pointer}.ctrl-disclaimer-box.ready:hover:not(:disabled){background:var(--color-background-secondary);color:var(--color-text-primary)}.ctrl-disclaimer-box.ready:active:not(:disabled){transform:scale(.97)}.ctrl-disclaimer-box:disabled{opacity:.4;cursor:not-allowed}.ctrl-disclaimer-box:focus-visible{box-shadow:var(--focus-ring);outline:none}.ctrl-btn{display:inline-flex;align-items:center;gap:5px;height:32px;padding:0 10px;border:1px solid var(--color-border-primary);border-radius:8px;background:var(--color-background-primary);color:var(--color-text-secondary);font-size:12.5px;font-family:inherit;font-weight:500;cursor:pointer;transition:background .15s,border-color .15s,color .15s;white-space:nowrap}.ctrl-btn:hover:not(:disabled){background:var(--color-background-secondary);border-color:var(--color-border-secondary);color:var(--color-text-primary)}.ctrl-btn:active:not(:disabled){transform:scale(.97)}.ctrl-btn:disabled{opacity:.45;cursor:not-allowed}.ctrl-btn:focus-visible{box-shadow:var(--focus-ring);border-color:transparent}.toggle-label{display:flex;align-items:center;gap:7px;font-size:12.5px;font-weight:500;color:var(--color-text-secondary);cursor:pointer;-webkit-user-select:none;user-select:none}.toggle-track{position:relative;width:36px;height:20px;border:none;border-radius:10px;background:var(--color-border-secondary);cursor:pointer;transition:background .2s cubic-bezier(.34,1.56,.64,1);padding:0;flex-shrink:0}.toggle-track.on{background:var(--color-border-info)}.toggle-track.disabled{opacity:.45;cursor:not-allowed;pointer-events:none}.toggle-knob{position:absolute;top:3px;left:3px;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0003;transition:transform .2s cubic-bezier(.34,1.56,.64,1)}.toggle-track.on .toggle-knob{transform:translate(16px)}.toggle-track:focus-visible{box-shadow:var(--focus-ring)}.messages-container{flex:1;overflow-y:auto;scroll-behavior:smooth}.chat-messages-list{display:flex;flex-direction:column;padding:12px 0 8px}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;min-height:240px;gap:10px;color:var(--color-text-tertiary);text-align:center;padding:32px}.empty-heading{font-size:15px;font-weight:500;color:var(--color-text-primary);margin-top:6px}.empty-sub{font-size:13px;color:var(--color-text-secondary)}.message-item{border-bottom:.5px solid var(--color-background-secondary);padding:10px 14px}.message-item:last-child{border-bottom:none}.message-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}.message-type{background:var(--color-background-info);color:var(--color-text-info);padding:1px 7px;border-radius:10px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}.message-timestamp{color:var(--color-text-tertiary);font-size:11px}.message-data{background:var(--color-background-tertiary);border:1px solid var(--color-border-primary);border-radius:6px;padding:8px 10px}.message-data pre{margin:0;font-family:Monaco,Menlo,Consolas,monospace;font-size:11.5px;line-height:1.5;color:var(--color-text-primary);white-space:pre-wrap;word-break:break-word}.typing-input-area{display:flex;align-items:center;gap:8px;padding:10px 12px;border-top:.5px solid var(--color-border-tertiary);background:var(--color-background-primary);flex-shrink:0;border-radius:0 0 10px 10px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.typing-input{flex:1;height:34px;padding:0 12px;border:1px solid var(--color-border-primary);border-radius:8px;font-size:13px;font-family:inherit;color:var(--color-text-primary);background:var(--color-background-tertiary);outline:none;transition:border-color .15s,background .15s}.typing-input::placeholder{color:var(--color-text-tertiary)}.typing-input:focus{border-color:var(--color-border-info);background:var(--color-background-primary)}.typing-input:disabled{background:var(--color-background-secondary);cursor:not-allowed;opacity:.6}.typing-send-btn{height:34px;padding:0 16px;border:none;border-radius:8px;background:var(--color-background-secondary);color:var(--color-text-tertiary);font-size:13px;font-family:inherit;font-weight:500;cursor:pointer;transition:background .15s,color .15s,transform .1s;white-space:nowrap;opacity:.4}.typing-send-btn.active{background:var(--color-text-primary);color:#fff;opacity:1}.typing-send-btn.active:hover{background:#27272a}.typing-send-btn:active:not(:disabled){transform:scale(.97)}.typing-send-btn:disabled{cursor:not-allowed}.typing-send-btn:focus-visible{box-shadow:var(--focus-ring)}@media(max-width:700px){.controls{gap:4px}.toggle-label span:first-child{display:none}.ch-conv-id-text{max-width:80px}.ch-acw-btn span{display:none}.ch-acw-btn{padding:0 9px}.ctrl-disclaimer-box span{max-width:120px;overflow:hidden;text-overflow:ellipsis}.ctrl-lang-select{min-width:90px}}.app{min-height:100vh;display:flex;flex-direction:column}.app-header{background-color:#f8f9fa;padding:1rem;border-bottom:1px solid #dee2e6;text-align:center}.app-header h1{margin:0;color:#343a40;font-size:1.5rem}.app-main{flex:1;display:flex;justify-content:center;align-items:center;padding:2rem}.chat-container{width:100%;max-width:800px;height:600px;background:#fff;border:1px solid #dee2e6;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#6c757d}:root{--color-text-primary: #18181b;--color-text-secondary: #52525b;--color-text-tertiary: #a1a1aa;--color-text-info: #1d4ed8;--color-text-success: #16a34a;--color-text-error: #dc2626;--color-text-warning: #d97706;--color-background-primary: #ffffff;--color-background-secondary: #f4f4f5;--color-background-tertiary: #fafafa;--color-background-info: #eff6ff;--color-background-success: #f0fdf4;--color-background-error: #fef2f2;--color-border-primary: #e4e4e7;--color-border-secondary: #d4d4d8;--color-border-tertiary: rgba(113, 113, 122, .3);--color-border-info: #2563eb;--color-border-success: #bbf7d0;--color-border-error: #fecaca;--focus-ring: 0 0 0 2px var(--color-border-info)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:var(--color-background-tertiary);color:var(--color-text-primary)}#root{min-height:100vh;min-height:100dvh}*:focus-visible{outline:none;box-shadow:var(--focus-ring)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}