@import"https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:Poppins,sans-serif;background:#fafafa;color:#1a1a1a}.app{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem}.container{width:100%;max-width:900px;height:90vh;background:#fff;border-radius:12px;box-shadow:0 2px 20px #00000014;display:flex;flex-direction:column;padding:2rem}h1{font-size:2rem;font-weight:600;margin-bottom:1.5rem;color:#1a1a1a;letter-spacing:-.5px}.connection-panel{display:flex;flex-wrap:wrap;gap:1rem;align-items:flex-end;padding:1.5rem;background:#f8f9fa;border-radius:8px;margin-bottom:1.5rem}.input-group{display:flex;flex-direction:column;gap:.4rem;flex:1;min-width:150px}.input-group label{font-size:.85rem;font-weight:500;color:#666;text-transform:uppercase;letter-spacing:.5px}.input-group input{padding:.7rem 1rem;border:1px solid #e0e0e0;border-radius:6px;font-family:Poppins,sans-serif;font-size:.95rem;transition:all .2s;background:#fff}.input-group input:focus{outline:none;border-color:#1a1a1a}.input-group input:disabled{background:#f5f5f5;color:#999}.connection-controls{display:flex;gap:.75rem;align-items:center}button{padding:.7rem 1.5rem;border:none;border-radius:6px;font-family:Poppins,sans-serif;font-size:.95rem;font-weight:500;cursor:pointer;transition:all .2s}.btn-primary{background:#1a1a1a;color:#fff}.btn-primary:hover:not(:disabled){background:#333;transform:translateY(-1px)}.btn-primary:disabled{background:#ccc;cursor:not-allowed}.btn-secondary{background:#fff;color:#1a1a1a;border:1px solid #e0e0e0}.btn-secondary:hover:not(:disabled){background:#f5f5f5;border-color:#1a1a1a}.btn-secondary:disabled{opacity:.5;cursor:not-allowed}.status{font-size:.85rem;font-weight:500;padding:.4rem .9rem;border-radius:20px;text-transform:uppercase;letter-spacing:.5px}.status.connected{color:#0d7c3e;background:#e6f7ed}.status.disconnected{color:#999;background:#f0f0f0}.chat-box{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:1rem;padding:1.5rem;background:#fafafa;border-radius:8px;margin-bottom:1.5rem}.chat-box::-webkit-scrollbar{width:6px}.chat-box::-webkit-scrollbar-track{background:transparent}.chat-box::-webkit-scrollbar-thumb{background:#ddd;border-radius:3px}.chat-box::-webkit-scrollbar-thumb:hover{background:#bbb}.message{max-width:75%;display:flex;flex-direction:column;gap:.5rem}.message.user{align-self:flex-end;align-items:flex-end}.message.agent{align-self:flex-start;align-items:flex-start}.message .content{padding:1rem 1.25rem;border-radius:12px;font-size:.95rem;line-height:1.6}.message.user .content{background:#1a1a1a;color:#fff;border-bottom-right-radius:4px}.message.agent .content{background:#fff;color:#1a1a1a;border:1px solid #e0e0e0;border-bottom-left-radius:4px}.message .content p{margin:0}.message .content p+p{margin-top:.75rem}.message .content code{background:#0000000d;padding:.2rem .4rem;border-radius:3px;font-size:.9em;font-family:Courier New,monospace}.message.user .content code{background:#ffffff26}.message .content pre{background:#0000000d;padding:1rem;border-radius:6px;overflow-x:auto;margin:.75rem 0}.message.user .content pre{background:#ffffff1a}.message .content pre code{background:none;padding:0}.timestamp{font-size:.75rem;color:#999;font-weight:400;padding:0 .5rem}.input-box{display:flex;gap:.75rem}.input-box input{flex:1;padding:.9rem 1.25rem;border:1px solid #e0e0e0;border-radius:8px;font-family:Poppins,sans-serif;font-size:.95rem;transition:all .2s}.input-box input:focus{outline:none;border-color:#1a1a1a}.input-box input:disabled{background:#f5f5f5;color:#999}.btn-send{background:#1a1a1a;color:#fff;padding:.9rem 2rem;border-radius:8px}.btn-send:hover:not(:disabled){background:#333;transform:translateY(-1px)}.btn-send:disabled{background:#ccc;cursor:not-allowed}@media (max-width: 768px){.app{padding:1rem}.container{height:95vh;padding:1.5rem;border-radius:8px}h1{font-size:1.5rem;margin-bottom:1rem}.connection-panel{padding:1rem}.message{max-width:85%}.btn-send{padding:.9rem 1.5rem}}
