:root{--bg-main: #eae8e4;--bg-chat-container: #f2f0ed;--bg-footer: #f2f0ed;--text-primary: #1e293b;--text-secondary: #475569;--text-inverse: #ffffff;--accent-color: #4f46e5;--accent-hover: #4338ca;--border-color: #d5d1cb;--user-msg-bg: #4f46e5;--user-msg-text: #ffffff;--bot-msg-bg: #e3e0db;--bot-msg-text: #1e293b;--footer-gap: calc(24vh + 2rem) }:root.dark{--bg-main: #0f172a;--bg-chat-container: #1e293b;--bg-footer: #1e293b;--text-primary: #f1f5f9;--text-secondary: #94a3b8;--text-inverse: #ffffff;--accent-color: #6366f1;--accent-hover: #818cf8;--border-color: #334155;--user-msg-bg: #6366f1;--user-msg-text: #ffffff;--bot-msg-bg: #334155;--bot-msg-text: #f1f5f9}html,body{margin:0;padding:0;height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;background-color:var(--bg-main);color:var(--text-primary);overscroll-behavior:none;overflow:hidden;box-sizing:border-box}*,*:before,*:after{box-sizing:inherit}nav{display:flex;align-items:center;justify-content:space-between;padding:.5rem 1rem;position:relative;z-index:10}main{display:flex;flex-direction:column;flex:1 1 0;min-height:0;padding:0 0 var(--footer-gap);overflow:hidden}#conversation-section{display:flex;flex-direction:column;flex:1 1 0;min-height:0}#app-root{display:flex;flex-direction:column;height:100%}#top-div{flex:1 1 auto;margin:0 auto;max-width:98%;min-height:0;overflow-y:auto;background-color:var(--bg-chat-container);border:1px solid var(--border-color);border-radius:10px;box-shadow:0 4px 10px #0000000d;padding:1rem;width:98%}#bottom-div{display:flex;flex-direction:column;gap:.4rem;align-items:stretch;justify-content:center;position:fixed;bottom:2vh;left:1rem;right:1rem;width:auto;padding:.5rem;background-color:transparent;border-radius:12px;border:1px solid var(--border-color);box-shadow:0 4px 15px #0000000d;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:1}.bottom-bg{position:absolute;inset:1px;border-radius:11px;background-color:var(--bg-footer);z-index:-1;pointer-events:none}.input-row{display:flex;gap:1rem;align-items:flex-end;width:100%}.cost-warning-bar{position:absolute;bottom:calc(100% + .4rem);left:0;right:0;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.25rem;padding:.3rem .5rem;border-radius:6px;background-color:#eab30826;border:1px solid rgba(234,179,8,.4);font-size:.75rem;line-height:1.3;animation:warningFadeIn .2s ease}@keyframes warningFadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.cost-warning-amount{color:#ca8a04;font-weight:600}.cost-warning-action{color:#92400e;opacity:.85}@media(prefers-color-scheme:dark){.cost-warning-amount{color:#fde047}.cost-warning-action{color:#fef08a;opacity:.8}.cost-warning-bar{background-color:#eab3081a;border-color:#eab3084d}}@property --angle{syntax: "<angle>"; initial-value: 0deg; inherits: false;}#bottom-div:before,#bottom-div:after{content:"";position:absolute;inset:-1px;border-radius:13px;background:conic-gradient(from var(--angle),#4f46e5,#ec4899,#8b5cf6,#3b82f6,#10b981,#4f46e5);opacity:0;transition:opacity .5s ease;pointer-events:none}#bottom-div:before{z-index:-2}#bottom-div:after{filter:blur(12px);z-index:-3}#bottom-div:focus-within{border-color:transparent}#bottom-div:focus-within:before{opacity:1;animation:borderRotate 4s linear infinite}#bottom-div:focus-within:after{opacity:.6;animation:borderRotate 4s linear infinite}@keyframes borderRotate{0%{--angle: 0deg}to{--angle: 360deg}}#bottom-div.sending{opacity:.8;pointer-events:none}#bottom-div.sending .bottom-bg{background-color:var(--bg-main)}#textbox{flex:1;resize:none;min-height:2.5rem;height:20vh;padding:.5rem;background:transparent;border:none;outline:none;font-family:inherit;font-size:1rem;color:var(--text-primary);transition:background-color .3s ease}#textbox.sending{cursor:default}#sendbtn{background-color:var(--accent-color);color:var(--text-inverse);border:none;border-radius:8px;font-weight:700;cursor:pointer;height:2.5rem;width:2.5rem;padding:0;margin-bottom:.25rem;transition:background-color .3s ease;white-space:nowrap;display:flex;align-items:center;justify-content:center;flex-shrink:0}#sendbtn.sending{background-color:#dc2626;cursor:pointer;pointer-events:auto}#sendbtn.sending:hover{background-color:#b91c1c}#sendbtn.sending .stop-icon{transition:transform .2s ease}#sendbtn.sending:hover .stop-icon{transform:scale(1.1)}#sendbtn.sending:active .stop-icon{transform:scale(.9)}#sendbtn:hover{background-color:var(--accent-hover)}#sendbtn.over-limit{background-color:var(--bg-secondary, #6b7280);opacity:.5;cursor:not-allowed}#sendbtn.over-limit:hover{background-color:var(--bg-secondary, #6b7280)}#sendbtn .send-icon{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}#sendbtn:hover:not(:disabled) .send-icon{transform:translate(2px,-2px) rotate(-5deg) scale(1.1)}#sendbtn:active:not(:disabled) .send-icon{transform:translate(6px,-6px) scale(.9)}.message-header{display:flex;flex-direction:column;margin-right:.5rem;min-width:max-content}.message-cost{font-size:.75rem;color:var(--text-secondary);margin-top:.2rem}.chatbotp,.userp{max-width:80%;margin:1rem 0;padding:1rem;display:flex;border-radius:10px;box-shadow:0 1px 2px #0000000d}.chatbotp{justify-content:flex-start;background-color:var(--bot-msg-bg);color:var(--bot-msg-text);margin-right:auto;border:1px solid var(--border-color)}.message-body{display:flex;flex-direction:column;flex:1;min-width:0}.reasoning-block{width:100%;margin-bottom:.6rem}.reasoning-toggle{display:inline-flex;align-items:center;gap:.3rem;background:none;border:none;padding:.15rem .3rem .15rem 0;cursor:pointer;font-size:.8rem;font-weight:600;color:var(--text-secondary);opacity:.8;letter-spacing:.02em;text-transform:uppercase;transition:opacity .15s}.reasoning-toggle:hover{opacity:1}.reasoning-chevron{display:inline-flex;align-items:center;transition:transform .2s ease;color:var(--text-secondary)}.reasoning-chevron svg{width:12px;height:12px}.reasoning-content{margin-top:.4rem;padding:.6rem .8rem;border-left:3px solid var(--accent-color);border-radius:0 4px 4px 0;background-color:#0000000a;font-size:.875rem;color:var(--text-secondary);opacity:.85}:root.dark .reasoning-content{background-color:#ffffff0a}.userp{justify-content:flex-end;background-color:var(--user-msg-bg);color:var(--user-msg-text);margin-left:auto}b{padding-right:.5rem}span{white-space-collapse:preserve;overflow:hidden}pre{white-space:pre-wrap;overflow-wrap:break-word;border-radius:6px;padding:.75rem;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,monospace;background-color:var(--bot-msg-bg);color:var(--text-primary);border:1px solid var(--border-color);margin:.5rem 0}#model-select-div{padding:.25rem}#model-select{max-width:200px}.select-wrapper{position:relative;display:inline-block}.select-chevron{position:absolute;right:.5rem;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--text-secondary);transition:color .2s ease}.select-wrapper:hover .select-chevron{color:var(--accent-color)}select{appearance:none;-webkit-appearance:none;background-color:var(--bg-chat-container);border:1px solid var(--border-color);border-radius:8px;padding:.4rem 1.75rem .4rem .6rem;color:var(--text-primary);font-size:.875rem;font-family:inherit;line-height:1.4;cursor:pointer;transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease;box-shadow:0 1px 2px #0000000d;text-overflow:ellipsis;white-space:nowrap;overflow:hidden}select:hover{border-color:var(--accent-color);box-shadow:0 1px 4px #0000001a}select:focus{outline:none;border-color:var(--accent-color);box-shadow:0 0 0 3px #4f46e526}select:focus:not(:focus-visible){box-shadow:0 1px 2px #0000000d}select:focus-visible{border-color:var(--accent-color);box-shadow:0 0 0 3px #4f46e526}:root.dark select{box-shadow:0 1px 3px #0003}:root.dark select:hover{box-shadow:0 1px 6px #0000004d}:root.dark select:focus-visible{box-shadow:0 0 0 3px #6366f140}select option,select optgroup{background-color:var(--bg-chat-container);color:var(--text-primary);font-size:.875rem}#top-menu-bar{display:flex;align-items:center;gap:.25rem}.new-chat-btn{background-color:var(--accent-color);border:none;border-radius:6px;padding:.3rem .6rem;color:var(--text-inverse);cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:.3rem;font-weight:500}.new-chat-btn-dim{opacity:.45}.new-chat-btn:hover{background-color:var(--accent-hover)}.new-chat-label{font-size:.85rem;white-space:nowrap}.menu-btn{background-color:transparent;border:none;border-radius:6px;padding:.4rem;color:var(--text-primary);cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.menu-btn:hover{opacity:.7}.dropdown-menu{position:absolute;top:calc(100% + 5px);right:0;background-color:var(--bg-chat-container);border:1px solid var(--border-color);border-radius:8px;box-shadow:0 4px 12px #00000026;min-width:150px;padding:.5rem;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.menu-item{display:flex;align-items:center;justify-content:space-between;padding:.6rem .8rem;cursor:pointer;border-radius:6px;transition:background-color .2s;color:var(--text-primary);font-size:.9rem;white-space:nowrap;gap:1rem}.menu-item:hover{background-color:var(--bot-msg-bg)}.verbosity-current{color:var(--text-secondary);font-size:.8rem}.menu-item.balance-item{cursor:default}.balance-amount{font-weight:700}.balance-amount.budget-warn{color:#ca8a04}.balance-amount.budget-over{color:#dc2626}@media(prefers-color-scheme:dark){.balance-amount.budget-warn{color:#fde047}.balance-amount.budget-over{color:#f87171}}.balance-loading{opacity:.5;animation:pulse 1.2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:.5}50%{opacity:1}}.balance-error{opacity:.5}.theme-toggle-small{width:16px;height:16px;display:flex;align-items:center;justify-content:center;position:relative}.icon-wrapper{position:relative;width:20px;height:20px;transition:transform .5s cubic-bezier(.4,0,.2,1)}.sun-icon,.moon-icon{position:absolute;top:0;left:0;transition:opacity .3s ease,transform .5s cubic-bezier(.4,0,.2,1)}.is-light .sun-icon{opacity:1;transform:rotate(0) scale(1)}.is-light .moon-icon{opacity:0;transform:rotate(90deg) scale(0)}.is-dark .sun-icon{opacity:0;transform:rotate(-90deg) scale(0)}.is-dark .moon-icon{opacity:1;transform:rotate(0) scale(1)}.is-dark .icon-wrapper{transform:rotate(360deg)}hr{height:1px;background-color:var(--border-color);border:none}p,ul,ol{margin-block-start:0;margin-block-end:0}@media(max-width:600px){:root{--footer-gap: calc(18vh + 1.5rem) }#top-div{max-width:95%;width:95%;padding:.75rem}.chatbotp,.userp{max-width:100%;font-size:.95rem;padding:.75rem;margin:.5rem 0;flex-direction:column}.chatbotp{margin-right:auto}.userp{margin-left:auto}.message-header{margin-right:0;margin-bottom:.35rem;flex-direction:row;justify-content:space-between;align-items:center;width:100%}.message-cost{margin-top:0}#bottom-div{bottom:1rem;left:.5rem;right:.5rem;padding:.4rem}#bottom-div:before,#bottom-div:after{display:block}#textbox{height:15vh;min-height:3.5rem;font-size:1rem;padding:.4rem}#sendbtn{width:2.5rem;height:2.5rem;margin-bottom:0;font-size:1rem}select{font-size:1rem}pre{font-size:.9rem;padding:.5rem}}.typing-indicator{display:inline-flex;align-items:center;gap:4px;margin-left:4px;overflow:visible}.typing-indicator span{width:6px;height:6px;background-color:var(--text-secondary);border-radius:50%;animation:typing 1.4s infinite ease-in-out both}.typing-indicator span:nth-child(1){animation-delay:-.32s}.typing-indicator span:nth-child(2){animation-delay:-.16s}@keyframes typing{0%,80%,to{transform:translateY(0);opacity:.5}40%{transform:translateY(-4px);opacity:1}}.menu-divider{margin:.25rem .5rem;border:none;height:1px;background-color:var(--border-color)}.menu-item-disabled{opacity:.4;cursor:default!important;pointer-events:none}.menu-item svg{flex-shrink:0}.language-submenu{display:grid;grid-template-columns:1fr 1fr;gap:2px;padding:.3rem;max-height:200px;overflow-y:auto}.language-option{padding:.35rem .6rem;border-radius:4px;cursor:pointer;font-size:.82rem;white-space:nowrap;color:var(--text-primary);transition:background-color .15s}.language-option:hover{background-color:var(--bot-msg-bg)}.language-option.language-active{font-weight:700;background-color:var(--bot-msg-bg)}.modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .15s ease-out}.modal-content{background-color:var(--bg-chat-container);border:1px solid var(--border-color);border-radius:12px;box-shadow:0 8px 32px #0003;padding:1.5rem;max-width:480px;width:90%;animation:modalSlideIn .2s ease-out}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1rem}.modal-title{margin:0;font-size:1.1rem;color:var(--text-primary)}.modal-close-btn{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--text-secondary);padding:0 .25rem;line-height:1;border-radius:4px;transition:color .2s}.modal-close-btn:hover{color:var(--text-primary)}.btn{padding:.5rem 1.25rem;border:none;border-radius:8px;font-size:.9rem;font-weight:500;cursor:pointer;transition:background-color .2s,opacity .2s}.btn-primary{background-color:var(--accent-color);color:var(--text-inverse)}.btn-primary:hover{background-color:var(--accent-hover)}.btn-secondary{background-color:var(--bot-msg-bg);color:var(--text-primary);border:1px solid var(--border-color)}.btn-secondary:hover{opacity:.8}.confirm-dialog{max-width:400px;text-align:center}.confirm-dialog .modal-title{text-align:center;margin-bottom:.75rem}.confirm-message{color:var(--text-secondary);font-size:.9rem;line-height:1.5;margin:0 0 1.25rem}.confirm-buttons{display:flex;gap:.75rem;justify-content:center;margin-top:1rem}.save-name-modal{max-width:380px}.save-name-modal .modal-title{margin-bottom:1rem}.save-name-input{width:100%;padding:.6rem .75rem;border:1px solid var(--border-color);border-radius:8px;background-color:var(--bg-main);color:var(--text-primary);font-size:.95rem;outline:none;transition:border-color .2s;box-sizing:border-box}.save-name-input:focus{border-color:var(--accent-color)}.save-name-input-wrapper{position:relative}.save-name-input.is-generating{opacity:.6}.generating-spinner{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:14px}.saved-chats-modal{max-width:520px;max-height:70vh;display:flex;flex-direction:column}.saved-chats-empty{color:var(--text-secondary);text-align:center;padding:2rem 0;margin:0}.saved-chats-list{overflow-y:auto;max-height:50vh;display:flex;flex-direction:column;gap:.35rem}.saved-chat-item{display:flex;align-items:center;border:1px solid var(--border-color);border-radius:8px;overflow:hidden;transition:border-color .2s}.saved-chat-item:hover{border-color:var(--accent-color)}.saved-chat-info{flex:1;padding:.75rem 1rem;cursor:pointer;display:flex;flex-direction:column;gap:.2rem;min-width:0}.saved-chat-name{font-weight:500;color:var(--text-primary);font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.saved-chat-meta{font-size:.78rem;color:var(--text-secondary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.saved-chat-delete{background:none;border:none;border-left:1px solid var(--border-color);padding:.75rem;cursor:pointer;color:var(--text-secondary);display:flex;align-items:center;justify-content:center;transition:color .2s,background-color .2s;flex-shrink:0;min-width:44px}.saved-chat-delete:hover{color:#ef4444;background-color:#ef444414}.saved-chat-delete.confirm-delete{color:#ef4444;background-color:#ef44441f;font-size:.78rem;font-weight:600}.error-toast{position:fixed;top:.75rem;left:50%;transform:translate(-50%) translateY(-120%);z-index:9999;display:flex;align-items:center;gap:.6rem;padding:.55rem .85rem;border-radius:.65rem;background:var(--bot-msg-bg);color:var(--text-primary);border:1px solid var(--border-color);box-shadow:0 4px 16px #0000001a;font-size:.82rem;opacity:0;pointer-events:none;transition:transform .35s cubic-bezier(.22,1,.36,1),opacity .35s ease;max-width:min(92vw,540px)}.error-toast--visible{transform:translate(-50%) translateY(0);opacity:1;pointer-events:auto}.error-toast__msg{white-space:nowrap;opacity:.85;font-weight:500}.error-toast__actions{display:flex;gap:.35rem;flex-shrink:0}.error-toast__btn{background:var(--accent-color);color:var(--text-inverse);border:none;border-radius:.4rem;padding:.28rem .6rem;font-size:.78rem;font-weight:500;cursor:pointer;white-space:nowrap;transition:background .15s ease}.error-toast__btn:hover{background:var(--accent-hover)}.error-toast__btn--alt{background:transparent;color:var(--accent-color);border:1px solid var(--accent-color)}.error-toast__btn--alt:hover{background:var(--accent-color);color:var(--text-inverse)}.error-toast__close{background:none;border:none;color:var(--text-secondary);font-size:.9rem;cursor:pointer;padding:.15rem .25rem;line-height:1;opacity:.6;transition:opacity .15s ease;flex-shrink:0}.error-toast__close:hover{opacity:1}@media(max-width:480px){.error-toast{flex-direction:column;align-items:stretch;text-align:center;gap:.45rem;padding:.6rem .75rem;max-width:92vw}.error-toast__close{position:absolute;top:.35rem;right:.45rem}.error-toast__actions{justify-content:center}}.login-page{display:flex;flex-direction:column;height:100%;background-color:var(--bg-main)}.login-nav{padding:.5rem 1rem;justify-content:flex-start}.login-back-btn{font-size:.9rem}.login-main{flex:1;display:flex;align-items:center;justify-content:center;padding:2rem 1rem}.login-card{background-color:var(--bg-chat-container);border:1px solid var(--border-color);border-radius:12px;box-shadow:0 8px 32px #00000026;padding:2rem;width:100%;max-width:380px}.login-title{margin:0 0 .5rem;font-size:1.4rem;color:var(--text-primary)}.login-subtitle{margin:0 0 1.5rem;color:var(--text-secondary);font-size:.9rem}.login-form{display:flex;flex-direction:column;gap:.5rem}.login-label{font-size:.85rem;font-weight:500;color:var(--text-secondary);margin-top:.5rem}.login-input{padding:.55rem .75rem;border:1px solid var(--border-color);border-radius:8px;background-color:var(--bg-main);color:var(--text-primary);font-size:1rem;outline:none;transition:border-color .2s}.login-input:focus{border-color:var(--accent-color)}.login-input:disabled{opacity:.6}.login-error{color:#dc2626;font-size:.875rem;margin:.25rem 0}.login-submit-btn{margin-top:1rem;width:100%;padding:.65rem;font-size:1rem}.login-submit-btn.login-loading{opacity:.7;cursor:not-allowed}.login-signed-in-label{color:var(--text-secondary);margin:0 0 1.25rem;font-size:.95rem}.login-logout-btn{width:100%}.login-menu-signout-btn{background:none;border:1px solid var(--border-color);border-radius:6px;padding:.2rem .6rem;font-size:.8rem;cursor:pointer;color:var(--text-secondary);transition:color .15s,border-color .15s}.login-menu-signout-btn:hover{color:var(--text-primary);border-color:var(--text-secondary)}
