*{margin:0;padding:0;box-sizing:border-box}html,body{margin:0;padding:0;height:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;background:#fafafa;color:#333;display:flex;flex-direction:column;height:100vh;overflow:hidden}.navbar{background:#fff;border-bottom:1px solid #e0e0e0;padding:.6rem 1rem;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;flex-shrink:0}.navbar-left{display:flex;justify-content:flex-start}.navbar-info{font-size:.75rem;color:#666}.navbar-title{font-size:.85rem;font-weight:600;color:#333;display:flex;align-items:center;gap:.4rem}.logo-icon{font-size:1.2rem}.navbar-right{display:flex;justify-content:flex-end;gap:.5rem}.navbar-btn{background:#333;color:#fff;border:none;padding:.4rem .5rem;border-radius:4px;cursor:pointer;transition:background .2s ease;display:flex;align-items:center;justify-content:center;gap:.3rem}.navbar-btn:hover{background:#111}.navbar-btn.active{background:#4caf50}.navbar-btn.active:hover{background:#45a049}.mode-label{font-size:.7rem;font-weight:600}.container{display:flex;flex-direction:column;height:calc(100vh - 53px);max-width:1200px;margin:0 auto;width:100%;padding:1rem;gap:1rem}.response-container{flex:1;display:flex;flex-direction:column;background:#fff;border:1px solid #e0e0e0;border-radius:8px;overflow:hidden;min-height:0}.response-header{padding:.75rem 1rem;border-bottom:1px solid #e0e0e0;background:#fafafa;display:flex;justify-content:space-between;align-items:center}.response-controls{display:flex;gap:.5rem}.control-btn{background:#fff;border:1px solid #ddd;padding:.4rem .75rem;border-radius:4px;font-size:.8rem;cursor:pointer;display:flex;align-items:center;gap:.4rem;transition:all .2s ease;color:#333}.control-btn:hover{background:#f5f5f5;border-color:#ccc}.control-btn.active{background:#333;color:#fff;border-color:#333}.response-content{flex:1;overflow-y:auto;padding:1.5rem;min-height:0}.markdown-content{line-height:1.6;color:#333}.markdown-content h1,.markdown-content h2,.markdown-content h3{margin-top:1.5rem;margin-bottom:.75rem;font-weight:600}.markdown-content h1{font-size:1.75rem;border-bottom:2px solid #e0e0e0;padding-bottom:.5rem}.markdown-content h2{font-size:1.4rem}.markdown-content h3{font-size:1.15rem}.markdown-content p{margin-bottom:1rem}.markdown-content ul,.markdown-content ol{margin-left:1.5rem;margin-bottom:1rem}.markdown-content li{margin-bottom:.5rem}.markdown-content code{background:#f5f5f5;padding:.15rem .4rem;border-radius:3px;font-family:Monaco,Courier New,monospace;font-size:.9em}.markdown-content pre{background:#f5f5f5;padding:1rem;border-radius:6px;overflow-x:auto;margin-bottom:1rem}.markdown-content pre code{background:none;padding:0}.markdown-content blockquote{border-left:4px solid #ddd;padding-left:1rem;color:#666;margin-bottom:1rem}.markdown-content a{color:#06c;text-decoration:none}.markdown-content a:hover{text-decoration:underline}.markdown-content table{border-collapse:collapse;width:100%;margin-bottom:1rem}.markdown-content th,.markdown-content td{border:1px solid #ddd;padding:.5rem .75rem;text-align:left}.markdown-content th{background:#f5f5f5;font-weight:600}.raw-content{width:100%;height:100%;border:none;font-family:Monaco,Courier New,monospace;font-size:.9rem;line-height:1.5;resize:none;background:#fafafa;padding:0}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#999;text-align:center}.empty-state svg{margin-bottom:1rem;opacity:.5}.empty-state p{font-size:.95rem;margin:0}.input-container{flex-shrink:0;background:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:1rem}.input-wrapper{position:relative;display:flex;gap:.75rem}.input-textarea{flex:1;border:1px solid #ddd;border-radius:6px;padding:.75rem;font-family:inherit;font-size:.95rem;resize:vertical;min-height:120px;max-height:300px;line-height:1.5}.input-textarea:focus{outline:none;border-color:#333}.input-buttons{display:flex;flex-direction:column;gap:.5rem;align-self:flex-end}.send-btn{background:#333;color:#fff;border:none;border-radius:6px;padding:.75rem 1rem;cursor:pointer;transition:background .2s ease;display:flex;align-items:center;justify-content:center}.send-btn:hover:not(:disabled){background:#111}.send-btn:disabled{background:#ccc;cursor:not-allowed}.restore-btn{background:#f5f5f5;color:#666;border:1px solid #ddd;border-radius:6px;padding:.5rem .75rem;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.restore-btn:hover{background:#e8e8e8;color:#333;border-color:#bbb}.input-footer{display:flex;justify-content:space-between;align-items:center;margin-top:.5rem;font-size:.75rem;color:#666}.input-footer-left{display:flex;align-items:center;gap:1rem}.char-count{color:#999}.attach-image-btn{background:#f5f5f5;color:#666;border:1px solid #ddd;border-radius:6px;padding:.4rem .75rem;cursor:pointer;font-size:.8rem;transition:all .2s ease;display:flex;align-items:center;gap:.4rem}.attach-image-btn:hover:not(:disabled){background:#e8e8e8;color:#333;border-color:#bbb}.attach-image-btn:disabled{opacity:.5;cursor:not-allowed}.image-preview-container{margin-bottom:.75rem;padding:.75rem;background:#f9f9f9;border-radius:8px;border:1px solid #e0e0e0;display:flex;gap:.75rem;flex-wrap:wrap}.image-preview-wrapper{position:relative;display:inline-block}.image-preview{max-width:200px;max-height:200px;border-radius:6px;display:block;border:2px solid #ddd;object-fit:cover}.remove-image-btn{position:absolute;top:-8px;right:-8px;background:#f44336;color:#fff;border:none;border-radius:50%;width:28px;height:28px;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px #0003;transition:all .2s ease}.remove-image-btn:hover{background:#d32f2f;transform:scale(1.1)}.status-indicator{color:#666;display:flex;align-items:center;gap:.3rem}.status-indicator.loading{color:#06c}.status-indicator.error{color:#d32f2f}.status-indicator.success{color:#2e7d32}#loading-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:1000;color:#fff}.loading-spinner{width:40px;height:40px;border:4px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite;margin-bottom:1rem}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:768px){.container{padding:.5rem;gap:.5rem}.response-content{padding:1rem}.navbar-info,.control-btn span{display:none}.input-container{padding:.75rem}.input-textarea{min-height:60px;font-size:.9rem}.input-footer,.input-footer-left{flex-direction:column;align-items:stretch;gap:.5rem}.attach-image-btn{width:100%;justify-content:center;padding:.6rem 1rem;font-size:.85rem}.char-count{text-align:center}.status-indicator{justify-content:center;text-align:center}.image-preview-container{padding:.5rem;margin-bottom:.5rem;gap:.5rem}.image-preview{max-width:100px;max-height:100px}.remove-image-btn{width:24px;height:24px;top:-6px;right:-6px}.remove-image-btn svg{width:14px;height:14px}.input-buttons{gap:.5rem}.send-btn,.restore-btn{padding:.6rem .8rem}}.settings-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}.settings-panel{background:#fff;border-radius:12px;max-width:600px;width:100%;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 20px 60px #0000004d}.settings-header{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1.5rem;border-bottom:1px solid #e0e0e0;flex-shrink:0}.settings-header h3{margin:0;font-size:1.1rem;font-weight:600;color:#333}.close-btn{background:none;border:none;font-size:1.5rem;color:#666;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.close-btn:hover{background:#f0f0f0;color:#333}.settings-content{padding:1.5rem;overflow-y:auto;flex:1}.setting-section{margin-bottom:2rem}.setting-section:last-child{margin-bottom:0}.setting-label{display:flex;flex-direction:column;margin-bottom:1rem}.setting-title{font-size:.95rem;font-weight:600;color:#333;margin-bottom:.25rem}.setting-description{font-size:.8rem;color:#999}.preset-buttons{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:.75rem}.preset-btn{display:flex;align-items:center;gap:.75rem;padding:.875rem 1rem;border:2px solid #e0e0e0;background:#fff;border-radius:8px;cursor:pointer;transition:all .2s;font-size:.85rem;color:#666}.preset-btn:hover{border-color:#2196f3;background:#f8fbff;transform:translateY(-1px);box-shadow:0 2px 8px #2196f326}.preset-btn.active{border-color:#2196f3;background:#2196f3;color:#fff;box-shadow:0 4px 12px #2196f34d}.preset-icon{font-size:1.25rem;flex-shrink:0}.preset-name{font-weight:500;text-align:left;line-height:1.3}.system-prompt-textarea{width:100%;padding:.875rem;border:2px solid #e0e0e0;border-radius:8px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:.875rem;line-height:1.5;resize:vertical;transition:border-color .2s}.system-prompt-textarea:focus{outline:none;border-color:#2196f3}.setting-actions{display:flex;gap:.75rem;margin-top:1rem}.btn-primary,.btn-secondary{padding:.625rem 1.25rem;border-radius:6px;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s;border:none}.btn-primary{background:#2196f3;color:#fff}.btn-primary:hover{background:#1976d2;transform:translateY(-1px);box-shadow:0 4px 12px #2196f34d}.btn-secondary{background:#f5f5f5;color:#666}.btn-secondary:hover{background:#e0e0e0}.param-group{margin-bottom:1.25rem}.param-group:last-child{margin-bottom:0}.param-label{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem;font-size:.875rem;font-weight:500;color:#333}.param-label input{padding:.5rem .75rem;border:2px solid #e0e0e0;border-radius:6px;font-size:.875rem;width:100px;text-align:center}.param-label input:focus{outline:none;border-color:#2196f3}.param-description{font-size:.75rem;color:#999;display:block;margin-top:.25rem}pre code.hljs{display:block;overflow-x:auto;padding:1em}code.hljs{padding:3px 5px}/*!
  Theme: GitHub
  Description: Light theme as seen on github.com
  Author: github.com
  Maintainer: @Hirse
  Updated: 2021-05-15

  Outdated base version: https://github.com/primer/github-syntax-light
  Current colors taken from GitHub's CSS
*/.hljs{color:#24292e;background:#fff}.hljs-doctag,.hljs-keyword,.hljs-meta .hljs-keyword,.hljs-template-tag,.hljs-template-variable,.hljs-type,.hljs-variable.language_{color:#d73a49}.hljs-title,.hljs-title.class_,.hljs-title.class_.inherited__,.hljs-title.function_{color:#6f42c1}.hljs-attr,.hljs-attribute,.hljs-literal,.hljs-meta,.hljs-number,.hljs-operator,.hljs-selector-attr,.hljs-selector-class,.hljs-selector-id,.hljs-variable{color:#005cc5}.hljs-meta .hljs-string,.hljs-regexp,.hljs-string{color:#032f62}.hljs-built_in,.hljs-symbol{color:#e36209}.hljs-code,.hljs-comment,.hljs-formula{color:#6a737d}.hljs-name,.hljs-quote,.hljs-selector-pseudo,.hljs-selector-tag{color:#22863a}.hljs-subst{color:#24292e}.hljs-section{color:#005cc5;font-weight:700}.hljs-bullet{color:#735c0f}.hljs-emphasis{color:#24292e;font-style:italic}.hljs-strong{color:#24292e;font-weight:700}.hljs-addition{color:#22863a;background-color:#f0fff4}.hljs-deletion{color:#b31d28;background-color:#ffeef0}