*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--bg: #1a1118;--surface: #221a20;--surface2: #2c2028;--border: #3d2e38;--accent: #c2678a;--accent-soft: rgba(194, 103, 138, .15);--text: #f0e8ec;--text-muted: #9a8090;--user-bg: #c2678a;--bot-bg: #2c2028;--radius: 20px;--radius-sm: 10px}html,body,#root{height:100%;background:var(--bg);color:var(--text);font-family:Inter,Segoe UI,sans-serif}.app{display:flex;flex-direction:column;height:100vh;max-width:780px;margin:0 auto}.header{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;background:var(--surface);border-bottom:1px solid var(--border);flex-shrink:0}.header-left{display:flex;align-items:center;gap:12px}.header-right{display:flex;align-items:center;gap:10px}.avatar-ring{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg,#c2678a,#8b4c6a);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}.bot-name{font-size:17px;font-weight:600;letter-spacing:-.2px;color:var(--text)}.bot-status{font-size:12px;color:#7ecb8f}.model-select{background:var(--surface2);border:1px solid var(--border);color:var(--text);border-radius:var(--radius-sm);padding:6px 10px;font-size:13px;cursor:pointer;outline:none}.model-select:hover{border-color:var(--accent)}.btn-icon{background:none;border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-muted);padding:6px 10px;cursor:pointer;font-size:15px;transition:all .15s}.btn-icon:hover{border-color:#e05b5b;color:#e05b5b}.main{flex:1;overflow:hidden;display:flex;flex-direction:column}.welcome{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px 24px;gap:14px;overflow-y:auto}.welcome-avatar{font-size:60px;margin-bottom:6px}.welcome-title{font-size:28px;font-weight:700;background:linear-gradient(135deg,#e8a0bc,#c2678a);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.welcome-sub{color:var(--text-muted);font-size:15px;max-width:400px;line-height:1.6}.suggestions{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:10px;max-width:580px}.chip{background:var(--surface2);border:1px solid var(--border);border-radius:20px;color:var(--text);padding:9px 16px;font-size:13px;cursor:pointer;transition:all .15s}.chip:hover{border-color:var(--accent);background:var(--accent-soft);color:#e8a0bc}.chat-window{flex:1;overflow-y:auto;padding:20px 16px;display:flex;flex-direction:column;gap:8px}.chat-window::-webkit-scrollbar{width:4px}.chat-window::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}.msg-row{display:flex;align-items:flex-end;gap:9px;max-width:100%}.msg-user{flex-direction:row-reverse}.msg-bot{flex-direction:row}.msg-avatar{width:32px;height:32px;border-radius:50%;font-size:16px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:var(--surface2);border:1px solid var(--border)}.user-av{background:var(--accent);border-color:var(--accent)}.bubble{max-width:70%;padding:12px 16px;border-radius:var(--radius);position:relative;line-height:1.65;word-break:break-word;font-size:14.5px}.bubble-user{background:var(--user-bg);color:#fff;border-bottom-right-radius:5px}.bubble-bot{background:var(--bot-bg);color:var(--text);border:1px solid var(--border);border-bottom-left-radius:5px}.bubble-error{border-color:#e05b5b!important}.bubble p{margin:0}.bubble strong{font-weight:600}.bubble code{background:#ffffff14;padding:2px 5px;border-radius:4px;font-size:13px}.typing{display:flex;align-items:center;gap:5px;padding:14px 18px}.dot{width:7px;height:7px;background:var(--accent);border-radius:50%;animation:pulse 1.2s infinite}.dot:nth-child(2){animation-delay:.2s}.dot:nth-child(3){animation-delay:.4s}@keyframes pulse{0%,60%,to{transform:translateY(0);opacity:.4}30%{transform:translateY(-5px);opacity:1}}.copy-btn{position:absolute;bottom:6px;right:8px;background:none;border:none;font-size:11px;cursor:pointer;opacity:0;transition:opacity .15s}.bubble-bot:hover .copy-btn{opacity:.6}.copy-btn:hover{opacity:1!important}.input-bar{padding:12px 16px 18px;background:var(--surface);border-top:1px solid var(--border);flex-shrink:0}.input-wrap{display:flex;align-items:flex-end;gap:10px;background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);padding:10px 12px;transition:border-color .2s}.input-wrap:focus-within{border-color:var(--accent)}.input-field{flex:1;background:none;border:none;outline:none;color:var(--text);font-size:14.5px;resize:none;max-height:130px;line-height:1.5;font-family:inherit}.input-field::placeholder{color:var(--text-muted)}.input-field:disabled{opacity:.5}.send-btn{width:36px;height:36px;border-radius:50%;border:none;background:var(--accent);color:#fff;font-size:15px;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:all .15s}.send-btn:hover:not(:disabled){background:#a8506f;transform:scale(1.05)}.send-btn:disabled{opacity:.3;cursor:not-allowed}.stop-btn{background:#8b4c6a}.stop-btn:hover{background:#6e3a54!important}.input-note{text-align:center;font-size:11px;color:var(--text-muted);margin-top:8px}@media (max-width: 580px){.bubble{max-width:84%}.bot-status{display:none}}.loading-screen{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;color:var(--text-muted);font-size:14px}.loader{width:36px;height:36px;border-radius:50%;border:3px solid var(--border);border-top-color:var(--accent);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.user-id-badge{font-size:11px;color:var(--text-muted);background:var(--surface2);border:1px solid var(--border);border-radius:20px;padding:4px 10px;font-family:monospace;white-space:nowrap}.voice-btn{width:36px;height:36px;border-radius:50%;border:1px solid var(--border);background:var(--surface2);color:var(--text);font-size:16px;cursor:pointer;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:all .15s}.voice-btn:hover:not(:disabled){border-color:var(--accent);background:var(--accent-soft)}.voice-btn.listening{background:var(--accent);border-color:var(--accent);color:#fff;animation:pulse-voice 1s infinite}.voice-btn:disabled{opacity:.3;cursor:not-allowed}@keyframes pulse-voice{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.input-footer{display:flex;align-items:center;justify-content:space-between;margin-top:10px}.voice-toggle{background:none;border:1px solid var(--border);border-radius:20px;color:var(--text-muted);padding:4px 12px;font-size:11px;cursor:pointer;transition:all .15s}.voice-toggle:hover{border-color:var(--accent)}.voice-toggle.active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}.msg-actions{display:flex;gap:6px;margin-top:8px}.action-btn{background:none;border:none;font-size:13px;cursor:pointer;opacity:.6;transition:opacity .15s}.bubble-bot:hover .action-btn{opacity:.8}.action-btn:hover{opacity:1!important}