:root{--bg-color:#09090b;--panel-bg:#111113;--text-primary:#fff;--text-secondary:#a1a1aa;--accent-pink:#f0f;--accent-pink-hover:#d900d9;--border-color:#27272a}body{background-color:var(--bg-color);color:var(--text-primary);margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;overflow-x:hidden}*{box-sizing:border-box}.app-container{flex-direction:column;height:100vh;margin:0 auto;display:flex}.app-header{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;padding:20px 40px;display:flex}.header-left{align-items:center;gap:30px;display:flex}.logo-section{letter-spacing:1px;align-items:center;gap:10px;font-weight:700;display:flex}.logo-icon{width:24px;height:24px}.live-agent-badge{letter-spacing:1px;color:var(--text-secondary);text-transform:uppercase;align-items:center;gap:8px;font-size:11px;font-weight:600;display:flex}.dot-indicator{background-color:var(--accent-pink);width:6px;height:6px;box-shadow:0 0 8px var(--accent-pink);border-radius:50%}.header-right{align-items:center;gap:20px;display:flex}.conv-title{color:var(--text-secondary);font-weight:500}.demo-badge{border:1px solid var(--border-color);color:var(--text-secondary);letter-spacing:1px;border-radius:4px;padding:4px 8px;font-size:10px}.main-content{flex:1;display:flex;overflow:hidden}.left-panel{border-right:1px solid var(--border-color);flex-direction:column;flex:1;padding:30px 40px;display:flex;overflow:hidden}.right-panel{background-color:var(--panel-bg);flex-direction:column;flex:1;display:flex}.hero-title{letter-spacing:-1px;margin:0 0 12px;font-size:40px;font-weight:700;line-height:1.1}.hero-subtitle{color:var(--text-secondary);margin:0 0 24px;font-size:15px}.section-label{letter-spacing:1px;color:var(--text-secondary);text-transform:uppercase;margin-bottom:12px;font-size:11px}.scenario-grid{grid-template-columns:1fr 1fr;gap:12px;margin-bottom:24px;display:grid}.scenario-btn{border:1px solid var(--border-color);color:var(--text-primary);text-align:left;cursor:pointer;background:0 0;border-radius:8px;padding:12px;font-size:14px;transition:all .2s}.scenario-btn:hover{background:#ffffff0d}.scenario-btn.active{border-color:var(--accent-pink);background:#ff00ff0d}.voice-select{border:1px solid var(--border-color);width:100%;color:var(--text-primary);appearance:none;cursor:pointer;background:0 0;border-radius:8px;margin-bottom:24px;padding:16px;font-size:14px}.visualizer-container{justify-content:center;align-items:center;height:40px;margin-bottom:24px;display:flex}.visualizer{align-items:center;gap:6px;display:flex}.dot{background-color:var(--accent-pink);opacity:.3;border-radius:2px;width:4px;height:4px;transition:opacity 50ms linear,height 50ms linear}.action-buttons{gap:16px;margin-bottom:24px;display:flex}.btn-call{background-color:var(--accent-pink);color:#fff;cursor:pointer;border:none;border-radius:8px;flex:2;padding:16px;font-size:16px;font-weight:600;transition:background .2s}.btn-call:hover{background-color:var(--accent-pink-hover)}.btn-call.connected{background-color:#ef4444}.btn-call.connected:hover{background-color:#dc2626}.btn-escalate{color:var(--text-primary);border:1px solid var(--border-color);cursor:pointer;background-color:#0000;border-radius:8px;flex:1;padding:16px;font-size:14px;transition:all .2s}.btn-escalate:hover{background:#ffffff0d}.chat-container{flex-direction:column;flex:1;gap:24px;padding:40px;display:flex;overflow-y:auto}.chat-message{border:1px solid var(--border-color);background-color:#ffffff08;border-radius:12px;max-width:80%;padding:20px}.chat-message.user{background-color:#ff00ff0d;border-color:#f0f3;align-self:flex-end}.chat-message.agent{align-self:flex-start}.msg-source{color:var(--accent-pink);letter-spacing:1px;text-transform:uppercase;margin-bottom:8px;font-size:11px}.chat-message.user .msg-source{color:var(--text-secondary)}.msg-text{font-size:15px;line-height:1.5}.chat-input-section{border-top:1px solid var(--border-color);padding:24px 40px}.input-wrapper{gap:12px;margin-bottom:12px;display:flex}.input-wrapper input{border:1px solid var(--border-color);color:#fff;background-color:#0000;border-radius:8px;flex:1;padding:16px;font-size:15px}.input-wrapper input:focus{border-color:var(--accent-pink);outline:none}.btn-send{background-color:var(--accent-pink);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:0 24px;font-weight:600}.disclaimer{color:var(--text-secondary);text-align:center;margin:0;font-size:11px}.stats-row{gap:40px;display:flex}.stat{flex-direction:column;gap:4px;display:flex}.stat-label{color:var(--text-secondary);letter-spacing:1px;font-size:10px}.stat-value{text-transform:uppercase;font-size:12px}@media screen and (width<=800px){.main-content{flex-direction:column;overflow-y:auto}.left-panel{border-right:none;border-bottom:1px solid var(--border-color);padding:24px 20px;overflow:visible}.app-header{padding:16px 20px}.header-left{gap:15px}.hero-title{font-size:32px}.scenario-grid{grid-template-columns:1fr}.right-panel{min-height:500px}.chat-container,.chat-input-section{padding:20px}}