*{box-sizing:border-box;margin:0;padding:0}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app{display:flex;flex-direction:column;height:100vh;background-color:#f5f5f5}.app-header{background-color:#1a73e8;color:#fff;padding:1rem 2rem;box-shadow:0 2px 4px #0000001a}.app-header h1{font-size:1.5rem;margin-bottom:.5rem}.header-stats{display:flex;gap:2rem;font-size:.875rem;opacity:.9}.header-stats span{display:flex;align-items:center}.app-container{display:flex;flex:1;overflow:hidden}.sidebar{width:300px;background-color:#fff;border-right:1px solid #e0e0e0;padding:1.5rem;overflow-y:auto}.sidebar-section{margin-bottom:2rem}.sidebar-section h3{font-size:.875rem;font-weight:600;text-transform:uppercase;color:#666;margin-bottom:1rem}.model-select{width:100%;padding:.5rem;border:1px solid #e0e0e0;border-radius:4px;font-size:.875rem;background-color:#fff;cursor:pointer}.model-select:focus{outline:none;border-color:#1a73e8}.database-list{display:flex;flex-direction:column;gap:.75rem}.database-item{padding:.75rem;background-color:#f9f9f9;border-radius:4px;border:1px solid #e0e0e0;transition:all .2s ease}.database-item:hover{background-color:#f0f0f0;border-color:#1a73e8}.database-item.selected{background-color:#e3f2fd;border-color:#1a73e8;border-width:2px}.database-name{font-weight:600;margin-bottom:.5rem;color:#333}.selected-db-info{margin-top:.5rem;padding:.5rem;background-color:#e3f2fd;border-left:3px solid #1a73e8;border-radius:4px}.selected-db-info small{font-size:.8rem;color:#1a73e8}.database-stats{display:flex;flex-direction:column;gap:.25rem;font-size:.75rem;color:#666}.main-content{flex:1;display:flex;flex-direction:column;background-color:#fff;overflow:hidden}.messages-container{flex:1;overflow-y:auto;padding:2rem;display:flex;flex-direction:column;gap:1rem}.welcome-message{text-align:center;padding:3rem 2rem;color:#666}.welcome-message h2{font-size:1.75rem;color:#333;margin-bottom:1rem}.welcome-message p{font-size:1.125rem;margin-bottom:2rem}.example-questions{text-align:left;max-width:600px;margin:0 auto;background-color:#f9f9f9;padding:1.5rem;border-radius:8px;border:1px solid #e0e0e0}.example-questions p{font-weight:600;margin-bottom:.75rem;font-size:.875rem;color:#333}.example-questions ul{list-style:none;padding:0}.example-questions li{padding:.5rem 0;color:#1a73e8;cursor:pointer;font-size:.875rem}.example-questions li:hover{text-decoration:underline}.message{display:flex;flex-direction:column;max-width:80%;padding:1rem;border-radius:8px;animation:fadeIn .3s ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.message-user{align-self:flex-end;background-color:#1a73e8;color:#fff}.message-assistant{align-self:flex-start;background-color:#f1f3f4;color:#333;border:1px solid #e0e0e0}.message-error{align-self:flex-start;background-color:#fce8e6;color:#c5221f;border:1px solid #f4b4af}.message-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem;font-size:.75rem;opacity:.8}.message-label{font-weight:600}.message-content{font-size:.9375rem;line-height:1.6;white-space:pre-wrap;word-wrap:break-word;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif}.message-assistant .message-content{max-height:none;overflow-y:visible}.message-stats{display:flex;gap:1rem;margin-top:.75rem;padding-top:.75rem;border-top:1px solid rgba(0,0,0,.1);font-size:.75rem;opacity:.7}.message-user .message-stats{border-top-color:#ffffff4d}.cache-hit{color:#0f9d58;font-weight:600}.loading{opacity:.7}.loading-dots{display:flex;gap:.25rem}.loading-dots span{animation:blink 1.4s infinite}.loading-dots span:nth-child(2){animation-delay:.2s}.loading-dots span:nth-child(3){animation-delay:.4s}@keyframes blink{0%,60%,to{opacity:.2}30%{opacity:1}}.input-form{display:flex;gap:.75rem;padding:1.5rem;background-color:#fff;border-top:1px solid #e0e0e0}.message-input{flex:1;padding:.75rem 1rem;border:1px solid #e0e0e0;border-radius:24px;font-size:.9375rem;outline:none}.message-input:focus{border-color:#1a73e8;box-shadow:0 0 0 2px #1a73e81a}.message-input:disabled{background-color:#f5f5f5;cursor:not-allowed}.send-button{padding:.75rem 2rem;background-color:#1a73e8;color:#fff;border:none;border-radius:24px;font-size:.9375rem;font-weight:600;cursor:pointer;transition:background-color .2s}.send-button:hover:not(:disabled){background-color:#1557b0}.send-button:disabled{background-color:#d3d3d3;cursor:not-allowed}.stop-button{padding:.75rem 2rem;background-color:#dc3545;color:#fff;border:none;border-radius:24px;font-size:.9375rem;font-weight:600;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:.5rem;animation:pulse 2s infinite}.stop-button:hover{background-color:#c82333;transform:scale(1.05)}@keyframes pulse{0%,to{box-shadow:0 0 #dc3545b3}50%{box-shadow:0 0 0 8px #dc354500}}.session-toggle-btn{padding:.5rem 1rem;background-color:#fff3;color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:6px;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s ease}.session-toggle-btn:hover{background-color:#ffffff4d;border-color:#ffffff80}.session-panel{width:300px;background-color:#f8f7ff;border-left:1px solid #e4e0f5;display:flex;flex-direction:column;overflow:hidden;box-shadow:-4px 0 16px #664ea212}.session-panel-header{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 1.125rem;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;box-shadow:0 2px 8px #664ea22e}.session-panel-header h3{font-size:.9375rem;font-weight:700;margin:0;letter-spacing:.01em}.new-session-btn{display:flex;align-items:center;gap:.3rem;padding:.45rem .9rem;background-color:#ffffff2e;color:#fff;border:1.5px solid rgba(255,255,255,.45);border-radius:20px;font-size:.8rem;font-weight:600;cursor:pointer;transition:all .18s ease;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.new-session-btn:hover{background-color:#ffffff4d;border-color:#ffffffb3;transform:translateY(-1px)}.session-list-container{flex:1;overflow-y:auto;padding:.875rem .75rem}.empty-sessions{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1rem;text-align:center;color:#999}.empty-sessions p{margin-bottom:1rem;font-size:.875rem}.create-first-session-btn{padding:.625rem 1.25rem;background-color:#667eea;color:#fff;border:none;border-radius:6px;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s ease}.create-first-session-btn:hover{background-color:#5568d3;transform:translateY(-1px)}.session-item{position:relative;padding:.875rem .875rem .875rem 1rem;margin-bottom:.5rem;background-color:#fff;border:1px solid #ece8f8;border-left:3px solid transparent;border-radius:10px;cursor:pointer;transition:all .18s ease;box-shadow:0 1px 3px #664ea20f}.session-item:hover{background-color:#f5f3ff;border-color:#c4b5fd;border-left-color:#a78bfa;box-shadow:0 3px 10px #664ea21a;transform:translate(-1px)}.session-item.active{background:linear-gradient(135deg,#f0ebff 0%,#faf5ff 100%);border-color:#a78bfa;border-left:3px solid #667eea;box-shadow:0 3px 12px #667eea2e}.session-item-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:.5rem}.session-title{font-size:.8rem;font-weight:600;color:#2d2250;line-height:1.35;flex:1;margin-right:.5rem;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.session-item.active .session-title{color:#5b21b6}.delete-session-btn{width:22px;height:22px;display:flex;align-items:center;justify-content:center;background-color:transparent;color:#999;border:none;border-radius:4px;font-size:1.25rem;font-weight:700;cursor:pointer;transition:all .2s ease;flex-shrink:0;line-height:1}.delete-session-btn:hover{background-color:#ff5252;color:#fff;transform:scale(1.1)}.session-item-meta{display:flex;gap:.5rem;font-size:.7rem;color:#8b7bb0;margin-bottom:.3rem;align-items:center}.session-item.active .session-item-meta{color:#6d28d9;font-weight:600}.session-database-badge{display:inline-flex;align-items:center;gap:.2rem;padding:.2rem .55rem;background-color:#eff6ff;color:#2563eb;border-radius:20px;font-size:.67rem;font-weight:600;margin-top:.3rem;border:1px solid #bfdbfe}.session-item.active .session-database-badge{background-color:#ede9fe;color:#6d28d9;border-color:#c4b5fd}.message-meta{display:flex;gap:.75rem;margin-top:.625rem;padding-top:.625rem;border-top:1px solid rgba(0,0,0,.08);font-size:.75rem}.meta-item{display:flex;align-items:center;gap:.25rem;color:#666;font-weight:500}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#a8a8a8}.message-metrics{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem;margin-top:.6rem;padding-top:.5rem;border-top:1px solid rgba(0,0,0,.06)}.message-metrics details{display:inline-block}.message-metrics summary{cursor:pointer;list-style:none;-webkit-user-select:none;user-select:none}.message-metrics summary::-webkit-details-marker{display:none}.token-breakdown{margin-top:.5rem;padding:.75rem;background:#f8f7ff;border:1px solid #ddd6fe;border-radius:8px;font-size:.75rem}.token-row{display:flex;justify-content:space-between;padding:.25rem 0}.token-row+.token-row{border-top:1px solid rgba(0,0,0,.05)}.token-label{color:#6b7280;font-weight:500}.token-value{color:#111827;font-weight:700;font-variant-numeric:tabular-nums}.metric-badge{display:inline-flex;align-items:center;gap:.25rem;padding:.2rem .6rem;border-radius:20px;font-size:.7rem;font-weight:600;letter-spacing:.02em;white-space:nowrap;transition:opacity .15s}.metric-badge:hover{opacity:.85}.metric-tokens-total{background:#ede9fe;color:#5b21b6;border:1px solid #ddd6fe}.metric-duration{background:#fef3c7;color:#92400e;border:1px solid #fde68a}.metric-model{background:#f0f9ff;color:#0369a1;border:1px solid #bae6fd;max-width:200px;overflow:hidden;text-overflow:ellipsis}.session-token-info{display:flex;gap:.4rem;align-items:center;margin-top:.3rem;flex-wrap:wrap}.session-token-info details{width:100%}.session-token-info summary{cursor:pointer;list-style:none;-webkit-user-select:none;user-select:none}.session-token-info summary::-webkit-details-marker{display:none}.session-token-info span{display:inline-flex;align-items:center;gap:.2rem;padding:.15rem .5rem;border-radius:20px;font-size:.67rem;font-weight:600;background:#ede9fe;color:#5b21b6;border:1px solid #ddd6fe}.session-token-breakdown{margin-top:.5rem;padding:.5rem;background:#f8f7ff;border:1px solid #ddd6fe;border-radius:6px;font-size:.65rem}.session-token-breakdown .token-row{display:flex;justify-content:space-between;padding:.2rem 0}.session-token-breakdown .token-row+.token-row{border-top:1px solid rgba(0,0,0,.05)}.session-token-breakdown .token-label{color:#6b7280;font-weight:500}.session-token-breakdown .token-value{color:#111827;font-weight:700;font-variant-numeric:tabular-nums}.session-token-info span:last-child{background:#f0fdf4;color:#166534;border-color:#bbf7d0}.streaming-response{padding:0;margin:0}.streaming-content{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:15px;line-height:1.6;color:#212529;position:relative;min-height:40px}.response-text{margin:0;white-space:pre-wrap;word-wrap:break-word}.loading-text{color:#999;font-style:italic}.streaming-cursor{display:inline-block;color:#1a73e8;animation:blink 1s step-end infinite;font-weight:700;margin-left:2px;font-size:18px}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:0}}.streaming-status{margin-top:12px;padding-top:12px;border-top:1px solid #e0e0e0;font-size:12px}.status-streaming{color:#1a73e8;display:flex;align-items:center;gap:8px;font-weight:500}.status-complete{color:#0f9d58;font-weight:600}.spinner{display:inline-block;width:14px;height:14px;border:2px solid #1a73e8;border-top-color:transparent;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}