:root{--bg:#0b0f14;--surface:#11161d;--surface-2:#161c25;--surface-3:#1c2330;--border:#1a1f27;--border-hover:#252d3a;--teal:#0ac8b9;--teal-dim:#0ac8b91f;--teal-glow:#0ac8b940;--purple:#8a4fff;--purple-dim:#8a4fff1f;--purple-glow:#8a4fff59;--text-primary:#e6eaf0;--text-secondary:#9aa4b2;--text-muted:#4a5568;--font-body:"DM Sans", sans-serif;--font-mono:"Space Mono", monospace;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--transition:.18s ease}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{width:100%;height:100%;overflow:hidden}body{background:var(--bg);color:var(--text-primary);font-family:var(--font-body);-webkit-font-smoothing:antialiased;font-size:15px;line-height:1.6}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--border-hover);border-radius:2px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}#app-container{background:var(--bg);grid-template-rows:100vh;grid-template-columns:260px 1fr 280px;height:100vh;display:grid;overflow:hidden}#sidebar-left{background:var(--surface);border-right:1px solid var(--border);flex-direction:column;display:flex;overflow:hidden}.sidebar-brand{border-bottom:1px solid var(--border);flex-shrink:0;align-items:center;gap:12px;padding:24px 20px 16px;display:flex}.sidebar-brand-text{flex-direction:column;display:flex}.sidebar-brand-name{color:var(--text-primary);letter-spacing:-.01em;font-size:17px;font-weight:600}.sidebar-brand-sub{color:var(--teal);font-size:11px;font-family:var(--font-mono);letter-spacing:.08em;text-transform:uppercase}.sidebar-new-chat{background:var(--teal-dim);border:1px solid var(--teal);border-radius:var(--radius-md);color:var(--teal);font-family:var(--font-body);cursor:pointer;transition:background var(--transition), box-shadow var(--transition);letter-spacing:.01em;flex-shrink:0;align-items:center;gap:8px;margin:16px 16px 8px;padding:10px 16px;font-size:13px;font-weight:500;display:flex}.sidebar-new-chat:hover{box-shadow:0 0 12px var(--teal-glow);background:#0ac8b933}.sidebar-section-label{font-size:10px;font-family:var(--font-mono);color:var(--text-muted);letter-spacing:.1em;text-transform:uppercase;flex-shrink:0;padding:16px 20px 8px}.chat-history-list{flex-direction:column;flex:1;gap:2px;padding:0 8px 16px;display:flex;overflow-y:auto}.chat-history-item{border-radius:var(--radius-md);cursor:pointer;transition:background var(--transition);border:1px solid #0000;flex-shrink:0;padding:10px 12px}.chat-history-item:hover{background:var(--surface-2);border-color:var(--border)}.chat-history-item.active{background:var(--surface-3);border-color:var(--border-hover)}.chat-history-title{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:13px;font-weight:500;overflow:hidden}.chat-history-time{color:var(--text-muted);font-size:11px;font-family:var(--font-mono);margin-top:4px}.sidebar-empty-hint{color:var(--text-muted);text-align:center;padding:24px 20px;font-size:12px;font-style:italic;line-height:1.6}#main-panel{background:var(--bg);flex-direction:column;height:100vh;display:flex;overflow:hidden}.chat-header{border-bottom:1px solid var(--border);background:var(--surface);flex-shrink:0;align-items:center;gap:14px;padding:18px 28px;display:flex}.chat-header-info{flex:1}.chat-header-title{color:var(--text-primary);letter-spacing:-.01em;font-size:16px;font-weight:600}.chat-header-status{color:var(--teal);align-items:center;gap:6px;margin-top:2px;font-size:12px;display:flex}.status-dot{background:var(--teal);width:6px;height:6px;box-shadow:0 0 6px var(--teal);border-radius:50%;flex-shrink:0;animation:2.4s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}#chat-container{flex-direction:column;flex:1;display:flex;overflow:hidden}#chat-messages{flex-direction:column;flex:1;gap:20px;padding:28px;display:flex;overflow-y:auto}.chat-row{align-items:flex-end;gap:10px;animation:.22s forwards messageIn;display:flex}@keyframes messageIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.chat-row-user{flex-direction:row-reverse}.chat-row-astra{flex-direction:row}.chat-bubble{border-radius:var(--radius-lg);white-space:pre-wrap;word-break:break-word;max-width:68%;padding:12px 16px;font-size:14.5px;line-height:1.6}.user-bubble{background:var(--purple-dim);color:var(--text-primary);border-bottom-right-radius:var(--radius-sm);border:1px solid #8a4fff4d}.astra-bubble{background:var(--surface-2);border:1px solid var(--border-hover);color:var(--text-primary);border-bottom-left-radius:var(--radius-sm)}.typing-indicator{align-items:center;gap:5px;height:auto;padding:14px 18px;display:flex}.typing-dot{background:var(--teal);opacity:.4;border-radius:50%;width:7px;height:7px;animation:1.4s ease-in-out infinite typingBlink}.typing-dot:first-child{animation-delay:0s}.typing-dot:nth-child(2){animation-delay:.2s}.typing-dot:nth-child(3){animation-delay:.4s}@keyframes typingBlink{0%{opacity:.3;transform:translateY(0)}20%{opacity:1;transform:translateY(-3px)}40%{opacity:.3;transform:translateY(0)}to{opacity:.3;transform:translateY(0)}}.chat-empty{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:16px;padding:40px;display:flex}.chat-empty-greeting{color:var(--text-secondary);letter-spacing:-.01em;font-size:22px;font-weight:500}.chat-empty-hint{color:var(--text-muted);font-size:13px;font-family:var(--font-mono)}#chat-input-bar{border-top:1px solid var(--border);background:var(--surface);flex-shrink:0;align-items:center;gap:12px;padding:16px 28px 20px;display:flex}#chat-input{background:var(--surface-2);border:1px solid var(--border-hover);border-radius:var(--radius-xl);color:var(--text-primary);font-family:var(--font-body);transition:border-color var(--transition), box-shadow var(--transition);outline:none;flex:1;padding:12px 18px;font-size:14.5px}#chat-input::placeholder{color:var(--text-muted)}#chat-input:focus{border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-dim)}#send-btn{background:var(--teal);cursor:pointer;width:42px;height:42px;transition:background var(--transition), box-shadow var(--transition), transform var(--transition);border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex}#send-btn:hover{box-shadow:0 0 16px var(--teal-glow);background:#0de8d7;transform:scale(1.05)}#send-btn:active{transform:scale(.97)}#send-btn svg{fill:#0b0f14;width:18px;height:18px}#sidebar-right{background:var(--surface);border-left:1px solid var(--border);flex-direction:column;padding:0;display:flex;overflow-y:auto}.right-panel-section{border-bottom:1px solid var(--border);padding:20px}.right-panel-section:last-child{border-bottom:none}.right-panel-label{font-size:10px;font-family:var(--font-mono);color:var(--text-muted);letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}.right-panel-btn{background:var(--surface-2);border:1px solid var(--border-hover);border-radius:var(--radius-md);width:100%;color:var(--text-secondary);font-family:var(--font-body);cursor:pointer;text-align:left;transition:background var(--transition), border-color var(--transition), color var(--transition);align-items:center;gap:10px;padding:10px 14px;font-size:13px;font-weight:500;display:flex}.right-panel-btn:hover{background:var(--surface-3);border-color:var(--border-hover);color:var(--text-primary)}.llm-custom-dropdown{width:100%;position:relative}.llm-trigger{background:var(--surface-2);border:1px solid var(--border-hover);border-radius:var(--radius-md);cursor:pointer;width:100%;transition:border-color var(--transition), box-shadow var(--transition);color:var(--text-primary);font-family:var(--font-body);align-items:center;gap:10px;padding:10px 12px;display:flex}.llm-trigger:hover,.llm-trigger.open{border-color:var(--teal);box-shadow:0 0 0 3px var(--teal-dim)}.llm-trigger-icon{flex-shrink:0;align-items:center;display:flex}.llm-trigger-text{text-align:left;flex-direction:column;flex:1;display:flex}.llm-trigger-label{color:var(--text-primary);font-size:13px;font-weight:500;line-height:1.2}.llm-trigger-provider{color:var(--text-muted);font-size:11px;font-family:var(--font-mono)}.llm-trigger-chevron{color:var(--text-secondary);transition:transform var(--transition);flex-shrink:0;align-items:center;display:flex}.llm-trigger.open .llm-trigger-chevron{transform:rotate(180deg)}.llm-panel{background:var(--surface-3);border:1px solid var(--border-hover);border-radius:var(--radius-md);z-index:100;animation:.15s forwards dropdownIn;position:absolute;top:calc(100% + 6px);left:0;right:0;overflow:hidden;box-shadow:0 8px 24px #0006}@keyframes dropdownIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.llm-panel-option{cursor:pointer;transition:background var(--transition);border-bottom:1px solid var(--border);align-items:center;gap:10px;padding:11px 12px;display:flex}.llm-panel-option:last-child{border-bottom:none}.llm-panel-option:not(.unavailable):hover{background:var(--surface-2)}.llm-panel-option.selected{background:var(--teal-dim)}.llm-panel-option.unavailable{opacity:.4;cursor:not-allowed}.llm-panel-icon{flex-shrink:0;align-items:center;display:flex}.llm-panel-text{flex-direction:column;flex:1;display:flex}.llm-panel-label{color:var(--text-primary);font-size:13px;font-weight:500;line-height:1.2}.llm-panel-provider{color:var(--text-muted);font-size:11px;font-family:var(--font-mono)}.llm-panel-status{flex-shrink:0}.llm-status-active{font-size:10px;font-family:var(--font-mono);color:var(--teal)}.llm-status-soon{font-size:10px;font-family:var(--font-mono);color:var(--text-muted);background:var(--surface);border:1px solid var(--border-hover);border-radius:4px;padding:2px 6px}.astra-avatar{flex-shrink:0;position:relative}.astra-avatar img{object-fit:cover;object-position:center top;border-radius:50%;display:block}.astra-avatar:after{content:"";border:1.5px solid var(--purple);box-shadow:0 0 10px var(--purple-glow), inset 0 0 8px var(--purple-glow);pointer-events:none;border-radius:50%;animation:3s ease-in-out infinite avatarGlow;position:absolute;inset:-2px}@keyframes avatarGlow{0%,to{box-shadow:0 0 10px var(--purple-glow), inset 0 0 8px var(--purple-glow)}50%{box-shadow:0 0 18px var(--purple-glow), inset 0 0 12px var(--purple-glow)}}.ws-panel{width:100%}.ws-app-list{flex-direction:column;gap:6px;display:flex}.ws-app-item{border-radius:var(--radius-md);border:1px solid var(--border);background:var(--surface-2);transition:border-color var(--transition), background var(--transition);align-items:center;gap:10px;padding:10px;display:flex}.ws-app-item:hover{border-color:var(--border-hover);background:var(--surface-3)}.ws-app-item.connected{background:var(--teal-dim);border-color:#0ac8b94d}.ws-app-icon{border-radius:var(--radius-sm);background:var(--surface);flex-shrink:0;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.ws-app-info{flex:1;min-width:0}.ws-app-name{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:12px;font-weight:600;overflow:hidden}.ws-app-desc{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;margin-top:1px;font-size:11px;overflow:hidden}.ws-connect-btn{font-size:11px;font-weight:500;font-family:var(--font-body);border-radius:var(--radius-sm);cursor:pointer;transition:background var(--transition), color var(--transition), border-color var(--transition);background:var(--teal-dim);border:1px solid var(--teal);color:var(--teal);flex-shrink:0;padding:5px 10px}.ws-connect-btn:hover{box-shadow:0 0 8px var(--teal-glow);background:#0ac8b938}.ws-connected-btn{border:1px solid var(--border-hover);color:var(--text-muted);background:0 0}.ws-connected-btn:hover{color:#ff6b6b;box-shadow:none;background:#ff505014;border-color:#ff505066}.ws-gcp-notice{font-size:10px;font-family:var(--font-mono);color:var(--text-muted);letter-spacing:.04em;align-items:center;gap:6px;margin-top:12px;display:flex}.ws-modal-overlay{z-index:1000;background:#000000a6;justify-content:center;align-items:center;animation:.15s forwards fadeIn;display:flex;position:fixed;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.ws-modal{background:var(--surface-3);border:1px solid var(--border-hover);border-radius:var(--radius-lg);width:380px;max-width:90vw;padding:28px;animation:.2s forwards modalIn;box-shadow:0 24px 64px #0009}@keyframes modalIn{0%{opacity:0;transform:scale(.96)translateY(8px)}to{opacity:1;transform:scale(1)translateY(0)}}.ws-modal-header{align-items:center;gap:12px;margin-bottom:16px;display:flex}.ws-modal-icon{border-radius:var(--radius-md);background:var(--teal-dim);border:1px solid var(--teal);flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;display:flex}.ws-modal-title{color:var(--text-primary);letter-spacing:-.01em;font-size:15px;font-weight:600}.ws-modal-subtitle{color:var(--teal);font-size:11px;font-family:var(--font-mono);margin-top:2px}.ws-modal-body{color:var(--text-secondary);margin-bottom:24px;font-size:13.5px;line-height:1.65}.ws-modal-body strong{color:var(--text-primary)}.ws-modal-footer{justify-content:flex-end;display:flex}.ws-modal-btn{background:var(--teal);border-radius:var(--radius-md);color:var(--bg);font-family:var(--font-body);cursor:pointer;transition:background var(--transition), box-shadow var(--transition);border:none;padding:10px 24px;font-size:13px;font-weight:600}.ws-modal-btn:hover{box-shadow:0 0 16px var(--teal-glow);background:#0de8d7}.ws-app-item.coming-soon{opacity:.75;border-style:dashed}.ws-app-item.coming-soon:hover{opacity:.9}.ws-coming-soon-badge{font-size:9px;font-family:var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--purple);background:var(--purple-dim);vertical-align:middle;border:1px solid #8a4fff4d;border-radius:4px;margin-left:6px;padding:1px 6px;font-weight:600;display:inline-block;position:relative;top:-1px}