*,*:before,*:after{box-sizing:border-box}:root{--color-bg: #ffffff;--color-bg-subtle: #f9fafb;--color-bg-hover: #f3f4f6;--color-bg-active: #e5e7eb;--color-text: #1f2937;--color-text-muted: #6b7280;--color-border: #e5e7eb;--color-input-bg: #ffffff;--color-primary: #2563eb;--color-primary-hover: #1d4ed8;--color-success: #059669;--color-error: #dc2626;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:var(--color-text);background-color:var(--color-bg);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:var(--color-primary);text-decoration:inherit}a:hover{color:var(--color-primary-hover)}body{margin:0;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1;color:var(--color-text)}button{border-radius:8px;border:1px solid var(--color-border);padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:var(--color-bg-subtle);color:var(--color-text);cursor:pointer;transition:border-color .2s,background-color .2s}button:hover{background-color:var(--color-bg-hover);border-color:var(--color-text-muted)}button:focus,button:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}input,textarea,select{box-sizing:border-box;margin:0;max-width:100%}.form-group input,.form-group textarea,.form-group select{width:100%;display:block}#root{min-height:100vh;width:100%;background:var(--color-bg)}.landing-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem;background:var(--color-bg)}.landing-card{width:100%;max-width:480px;background:var(--color-bg);border-radius:12px;padding:2rem;box-shadow:0 1px 3px #00000014;border:1px solid var(--color-border)}.landing-logo{display:block;margin:0 auto .25rem;max-width:100%;height:auto;max-height:80px;object-fit:contain}.landing-subtitle{margin:0 0 1.5rem;color:var(--color-text-muted);font-size:.95rem}.landing-form{display:flex;flex-direction:column;gap:1rem;width:100%}.landing-form .btn-primary{width:100%}.landing-section h2{margin:0 0 .75rem;font-size:1.1rem;font-weight:600;color:var(--color-text)}.landing-hint{margin:0 0 .5rem;font-size:.85rem;color:var(--color-text-muted)}.form-group{margin-bottom:.75rem;width:100%}.form-group:last-child{margin-bottom:0}.form-group label{display:block;margin-bottom:.35rem;font-size:.9rem;color:var(--color-text)}.form-group input{width:100%;padding:.6rem .75rem;border:1px solid var(--color-border);border-radius:8px;font-size:1rem;background:var(--color-input-bg);color:var(--color-text)}.form-group input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #2563eb26}.validation-status{display:flex;flex-direction:column;gap:.35rem;margin:.5rem 0}.validation-item{display:flex;align-items:center;gap:.5rem;font-size:.9rem}.validation-item.valid{color:var(--color-success)}.validation-item.invalid{color:var(--color-error)}.validation-icon{font-weight:700}.error-msg{color:var(--color-error);font-size:.9rem;padding:.5rem 0}.btn-primary{margin-top:.5rem;padding:.75rem 1.5rem;font-size:1rem;background:var(--color-primary);color:#fff;border:none;border-radius:8px;cursor:pointer}.btn-primary:hover:not(:disabled){background:var(--color-primary-hover)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.landing-developer{margin:1.5rem 0 0;padding-top:1.5rem;border-top:1px solid var(--color-border);font-size:.9rem;color:var(--color-text-muted);text-align:center}.landing-developer a{color:var(--color-primary)}.landing-developer a:hover{text-decoration:underline}.chat-view-placeholder{min-height:100vh;display:flex;align-items:center;justify-content:center;color:var(--color-text-muted)}.main-layout{display:grid;grid-template-columns:260px 1fr 280px;height:100vh;max-height:100vh;overflow:hidden;background:var(--color-bg)}.left-panel{display:flex;flex-direction:column;background:var(--color-bg);border-right:1px solid var(--color-border);overflow:hidden}.left-panel-header{flex-shrink:0;display:flex;align-items:center;min-height:56px;padding:0 1.25rem;border-bottom:1px solid var(--color-border)}.left-panel-brand{margin:0;max-width:100%;height:auto;max-height:36px;object-fit:contain;display:block}.left-panel-top{flex:1;overflow:hidden;padding:1rem;min-height:0}.nav-home{display:block;width:100%;padding:.5rem .75rem;margin-bottom:.5rem;background:none;border:none;color:var(--color-text);cursor:pointer;text-align:left;border-radius:8px}.nav-home:hover{background:var(--color-bg-hover)}.section-title{margin:.5rem 0;font-size:.9rem;color:var(--color-text-muted)}.btn-new-chat{width:100%;padding:.6rem;margin-bottom:.75rem;background:var(--color-primary);color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:.9rem}.btn-new-chat:hover{background:var(--color-primary-hover)}.conversation-list{display:flex;flex-direction:column;gap:.25rem}.conversation-item{display:flex;align-items:center;justify-content:space-between;padding:.5rem .75rem;border-radius:8px;cursor:pointer;color:var(--color-text)}.conversation-item:hover{background:var(--color-bg-hover)}.conversation-item.active{background:var(--color-bg-hover);box-shadow:0 1px 2px #0000000d}.conv-title{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9rem}.conv-actions{display:flex;align-items:center;gap:.15rem;position:relative}.conv-more{padding:.2rem .35rem;background:none;border:none;color:var(--color-text-muted);cursor:pointer;font-size:1rem;font-weight:700;border-radius:4px}.conv-more:hover{color:var(--color-text);background:var(--color-bg-hover)}.conv-dropdown{position:absolute;top:100%;right:0;margin-top:.25rem;background:var(--color-bg);border:1px solid var(--color-border);border-radius:8px;box-shadow:0 4px 12px #0000001a;z-index:10;min-width:100px;display:flex;flex-direction:column;padding:.25rem 0}.conv-dropdown button{padding:.4rem .75rem;text-align:left;background:none;border:none;color:var(--color-text);cursor:pointer;font-size:.9rem}.conv-dropdown button:hover{background:var(--color-bg-hover)}.conv-dropdown-delete:hover{color:var(--color-error)}.conv-delete{padding:.2rem .4rem;background:none;border:none;color:var(--color-text-muted);cursor:pointer;font-size:1.2rem;border-radius:4px}.conv-delete:hover{color:var(--color-error);background:#dc262614}.conv-rename-form{width:100%;display:flex;flex-direction:column;gap:.5rem}.conv-rename-form input{width:100%;padding:.4rem .5rem;font-size:.9rem;border:1px solid var(--color-border);border-radius:6px;background:var(--color-input-bg);color:var(--color-text);box-sizing:border-box}.conv-rename-form input:focus{outline:none;border-color:var(--color-primary)}.conv-rename-actions{display:flex;gap:.35rem}.conv-rename-save,.conv-rename-cancel{padding:.3rem .6rem;font-size:.85rem;border-radius:6px;cursor:pointer}.conv-rename-save{background:var(--color-primary);color:#fff;border:none}.conv-rename-save:hover{background:var(--color-primary-hover)}.conv-rename-cancel{background:transparent;border:1px solid var(--color-border);color:var(--color-text)}.conv-rename-cancel:hover{background:var(--color-bg-hover)}.left-panel-footer{flex-shrink:0;display:flex;flex-direction:column;justify-content:flex-end;min-height:180px;padding:1rem 1.25rem;border-top:1px solid var(--color-border)}.api-settings-btn{width:100%;padding:.5rem .75rem;margin-bottom:.5rem;background:none;border:none;color:var(--color-text);cursor:pointer;text-align:left;font-size:.9rem;border-radius:8px}.api-settings-btn:hover{background:var(--color-bg-hover)}.user-info-footer{display:flex;flex-direction:column;font-size:.8rem;color:var(--color-text-muted)}.user-name{font-weight:500;color:var(--color-text)}.modal-overlay{position:fixed;inset:0;background:#0006;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:var(--color-bg);border-radius:12px;padding:0;min-width:400px;max-width:90vw;box-shadow:0 4px 24px #0000001f;border:1px solid var(--color-border)}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;border-bottom:1px solid var(--color-border)}.modal-header h3{margin:0;font-size:1.1rem;color:var(--color-text)}.modal-close{background:none;border:none;color:var(--color-text-muted);font-size:1.5rem;cursor:pointer;padding:0 .25rem;border-radius:4px}.modal-close:hover{color:var(--color-text);background:var(--color-bg-hover)}.modal-body{padding:1.25rem;box-sizing:border-box}.modal-body .form-group input{width:100%;box-sizing:border-box}.modal-footer{display:flex;justify-content:flex-end;gap:.5rem;padding:1rem 1.25rem;border-top:1px solid var(--color-border)}.btn-secondary{padding:.5rem 1rem;background:transparent;border:1px solid var(--color-border);color:var(--color-text);border-radius:8px;cursor:pointer}.btn-secondary:hover{background:var(--color-bg-hover)}.center-panel{display:flex;flex-direction:column;background:var(--color-bg);overflow:hidden;min-height:0}.center-placeholder,.right-placeholder{flex:1;display:flex;align-items:center;justify-content:center;color:var(--color-text-muted)}.chat-header{flex-shrink:0;display:flex;justify-content:space-between;align-items:center;min-height:56px;padding:0 1.25rem;border-bottom:1px solid var(--color-border);background:var(--color-bg)}.chat-title{margin:0;font-size:1.1rem;color:var(--color-text)}.chat-header-actions{display:flex;gap:.5rem}.copy-download-menu{position:relative}.menu-trigger{padding:.4rem .75rem;font-size:.9rem;background:var(--color-bg-subtle);border:1px solid var(--color-border);border-radius:8px;color:var(--color-text);cursor:pointer}.menu-trigger:hover{background:var(--color-bg-hover);border-color:var(--color-text-muted)}.menu-backdrop{position:fixed;inset:0;z-index:1}.menu-dropdown{position:absolute;top:100%;right:0;margin-top:.25rem;background:var(--color-bg);border:1px solid var(--color-border);border-radius:8px;box-shadow:0 4px 12px #0000001a;z-index:2;min-width:160px}.menu-dropdown button{display:block;width:100%;padding:.5rem 1rem;text-align:left;background:none;border:none;color:var(--color-text);cursor:pointer;font-size:.9rem;border-radius:0}.menu-dropdown button:hover{background:var(--color-bg-hover)}.chat-body{flex:1;min-height:0;overflow-y:auto;padding:1rem;background:var(--color-bg)}.message-list{display:flex;flex-direction:column;gap:1rem}.message-bubble{max-width:85%;padding:1rem;border-radius:12px}.message-bubble.user{align-self:flex-end;background:var(--color-bg);border:1px solid var(--color-border)}.message-bubble.assistant{align-self:flex-start;background:var(--color-bg-subtle);border:1px solid var(--color-border)}.message-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.message-role{font-weight:600;font-size:.9rem;color:var(--color-text)}.copy-btn{padding:.2rem .5rem;font-size:.75rem;background:none;border:none;color:var(--color-text-muted);cursor:pointer;border-radius:4px}.copy-btn:hover{color:var(--color-primary);background:#2563eb14}.message-content{white-space:pre-wrap;word-break:break-word;color:var(--color-text)}.message-usage{margin-top:.5rem;font-size:.75rem;color:var(--color-text-muted)}.chat-footer{flex-shrink:0;min-height:180px;padding:1rem 1.25rem;border-top:1px solid var(--color-border);background:var(--color-bg)}.model-selector{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem}.model-selector label{font-size:.9rem;color:var(--color-text)}.model-selector select{padding:.4rem .6rem;font-size:.9rem;background:var(--color-input-bg);border:1px solid var(--color-border);border-radius:8px;color:var(--color-text)}.model-selector select:focus{outline:none;border-color:var(--color-primary)}.model-selector-empty{font-size:.85rem;color:var(--color-text-muted);margin-bottom:.5rem}.chat-input-form{margin-bottom:.5rem}.chat-input-row{display:flex;gap:.5rem;align-items:flex-end}.chat-add-file-btn{flex-shrink:0;width:36px;height:36px;min-height:36px;padding:0;font-size:1.25rem;font-weight:300;line-height:1;border:1px solid var(--color-border);border-radius:8px;background:var(--color-bg);color:var(--color-text);cursor:pointer;display:flex;align-items:center;justify-content:center}.chat-add-file-btn:hover:not(:disabled){background:var(--color-input-bg);border-color:var(--color-primary)}.chat-add-file-btn:disabled{opacity:.5;cursor:not-allowed}.chat-file-input-hidden{position:absolute;width:0;height:0;opacity:0;pointer-events:none}.chat-input-form textarea{flex:1;padding:.6rem .75rem;border:1px solid var(--color-border);border-radius:8px;font-size:1rem;font-family:inherit;background:var(--color-input-bg);color:var(--color-text);resize:vertical;min-height:44px}.chat-input-form textarea::placeholder{color:var(--color-text-muted)}.chat-input-form textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px #2563eb26}.chat-input-form button{padding:.5rem 1rem;background:var(--color-primary);color:#fff;border:none;border-radius:8px;cursor:pointer}.chat-input-form button:hover:not(:disabled){background:var(--color-primary-hover)}.chat-input-form button:disabled{opacity:.5;cursor:not-allowed}.chat-attachments{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.5rem}.chat-attachment-chip{display:inline-flex;align-items:center;gap:.25rem;padding:.2rem .5rem;font-size:.8rem;background:var(--color-input-bg);border:1px solid var(--color-border);border-radius:6px;color:var(--color-text)}.chat-attachment-remove{padding:0 .15rem;font-size:1rem;line-height:1;background:none;border:none;color:var(--color-text-muted);cursor:pointer}.chat-attachment-remove:hover{color:var(--color-error)}.chat-upload-error{font-size:.85rem;color:var(--color-error);margin-top:.35rem}.chat-error{font-size:.85rem;color:var(--color-error);margin-bottom:.5rem}.token-summary{display:flex;flex-wrap:wrap;gap:1rem;font-size:.8rem;color:var(--color-text-muted)}.right-panel{display:flex;flex-direction:column;background:var(--color-bg);border-left:1px solid var(--color-border);overflow:hidden}.right-panel-header{flex-shrink:0;display:flex;align-items:center;min-height:56px;padding:0 1.25rem;border-bottom:1px solid var(--color-border)}.right-panel-title{margin:0;font-size:1rem;font-weight:600;color:var(--color-text)}.right-panel-content{flex:1;overflow:hidden;padding:1rem;min-height:0}.right-section-title{margin:0 0 .5rem;font-size:.95rem;font-weight:600;color:var(--color-text)}.right-section-hint{margin:0 0 .5rem;font-size:.8rem;color:var(--color-text-muted)}.model-params-form .form-group{margin-bottom:1rem}.model-params-form,.system-prompt-editor{background:var(--color-bg-subtle);border:1px solid var(--color-border);border-radius:8px;padding:1rem;box-sizing:border-box}.model-params-form input,.system-prompt-editor textarea{width:100%;box-sizing:border-box}.model-params-form input{width:100%;padding:.5rem .75rem;font-size:.9rem;background:var(--color-input-bg);border:1px solid var(--color-border);border-radius:8px;color:var(--color-text)}.model-params-form input:focus{outline:none;border-color:var(--color-primary)}.system-prompt-editor{margin-top:1rem}.system-prompt-editor textarea{width:100%;padding:.6rem .75rem;font-size:.9rem;font-family:inherit;background:var(--color-input-bg);border:1px solid var(--color-border);border-radius:8px;color:var(--color-text);resize:vertical}.system-prompt-editor textarea::placeholder{color:var(--color-text-muted)}.system-prompt-editor textarea:focus{outline:none;border-color:var(--color-primary)}.right-panel-footer{flex-shrink:0;display:flex;flex-direction:column;justify-content:flex-end;min-height:180px;padding:1rem 1.25rem;border-top:1px solid var(--color-border)}.app-developer-info{font-size:.85rem;color:var(--color-text-muted)}.app-info-content p{margin:.25rem 0}.app-info-content a{color:var(--color-primary)}@media(max-width:900px){.main-layout{grid-template-columns:1fr}}