.chat-page-body{margin:0;padding:0;overflow:hidden;height:100vh;background:var(--bg-core)}.chat-page{display:flex;height:100vh;width:100%;overflow:hidden}.chat-sidebar{width:280px;height:100vh;background:var(--glass-bg);border-right:1px solid var(--glass-border);display:flex;flex-direction:column;flex-shrink:0;transition:transform .3s ease}.sidebar-header{padding:20px;border-bottom:1px solid var(--glass-border)}.sidebar-logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text-primary)}.sidebar-logo .logo-image{width:32px;height:32px;-o-object-fit:contain;object-fit:contain}.sidebar-logo .logo-text{font-family:Plus Jakarta Sans,sans-serif;font-weight:600;font-size:1.125rem}.sidebar-content{flex:1;padding:20px;overflow-y:auto;display:flex;flex-direction:column;gap:24px}.new-chat-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:12px 16px;background:var(--accent-primary);color:#000;border:none;border-radius:12px;font-family:Inter,sans-serif;font-weight:500;font-size:.875rem;cursor:pointer;transition:all .2s ease}.new-chat-btn:hover{opacity:.9;transform:translateY(-1px)}.new-chat-btn:active{transform:translateY(0)}.model-selector{display:flex;flex-direction:column;gap:12px}.selector-label{font-size:.75rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;color:var(--text-tertiary)}.model-options{display:flex;flex-direction:column;gap:8px}.model-option{display:flex;flex-direction:column;gap:4px;padding:12px;background:transparent;border:1px solid var(--glass-border);border-radius:12px;cursor:pointer;transition:all .2s ease;text-align:left}.model-option:hover{background:var(--glass-hover);border-color:var(--text-tertiary)}.model-option.active{background:#00f0ff1a;border-color:var(--accent-primary)}.model-option .model-info{display:flex;flex-direction:column;gap:2px}.model-option .model-name{font-weight:500;font-size:.875rem;color:var(--text-primary)}.model-option .model-desc{font-size:.75rem;color:var(--text-tertiary)}.model-option .model-price{font-size:.75rem;font-weight:500;color:var(--text-secondary);margin-top:4px}.model-option .model-price.free{color:#10b981}.sidebar-footer{padding:16px 20px;border-top:1px solid var(--glass-border);display:flex;flex-direction:column;gap:12px}.user-balance{display:flex;align-items:center;gap:6px;padding:10px 12px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:10px}.user-balance .hubcoin-icon{width:18px;height:18px}.user-balance .balance-amount{font-weight:600;font-size:.875rem;color:var(--text-primary)}.user-balance .balance-label{font-size:.75rem;color:var(--text-tertiary)}.theme-toggle-sidebar{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:transparent;border:1px solid var(--glass-border);border-radius:8px;cursor:pointer;color:var(--text-secondary);transition:all .2s ease}.theme-toggle-sidebar:hover{background:var(--glass-hover);color:var(--text-primary)}.sidebar-user{display:flex;align-items:center;gap:10px;padding:8px 0}.sidebar-avatar{width:32px;height:32px;border-radius:50%;-o-object-fit:cover;object-fit:cover;background:var(--glass-border)}.sidebar-username{font-size:.875rem;font-weight:500;color:var(--text-primary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sidebar-logout-btn{display:flex;align-items:center;gap:8px;width:100%;padding:10px 12px;background:transparent;border:1px solid var(--glass-border);border-radius:10px;color:var(--text-secondary);font-size:.875rem;cursor:pointer;transition:all .2s ease}.sidebar-logout-btn:hover{background:#ef44441a;border-color:#ef44444d;color:#ef4444}.chat-main{flex:1;display:flex;flex-direction:column;height:100vh;overflow:hidden;background:var(--bg-core)}.chat-header-mobile{display:none;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--glass-bg);border-bottom:1px solid var(--glass-border)}.toggle-sidebar-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:transparent;border:none;color:var(--text-primary);cursor:pointer}.current-model{font-weight:500;font-size:.875rem;color:var(--text-primary)}.mobile-balance{display:flex;align-items:center;gap:4px;font-size:.875rem;font-weight:500;color:var(--text-secondary)}.hubcoin-icon-small{width:16px;height:16px}.chat-messages-container{flex:1;overflow-y:auto;padding:24px;display:flex;flex-direction:column}.chat-welcome-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;flex:1;padding:40px 20px;max-width:600px;margin:0 auto}.chat-welcome-screen.hidden{display:none}.welcome-icon-large{width:80px;height:80px;display:flex;align-items:center;justify-content:center;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:20px;color:var(--accent-primary);margin-bottom:24px}.welcome-title{font-family:Plus Jakarta Sans,sans-serif;font-size:1.5rem;font-weight:600;color:var(--text-primary);margin:0 0 12px}.welcome-subtitle{font-size:1rem;color:var(--text-secondary);margin:0 0 32px}.welcome-suggestions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.suggestion-chip{padding:10px 16px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:20px;color:var(--text-secondary);font-size:.875rem;cursor:pointer;transition:all .2s ease}.suggestion-chip:hover{background:var(--glass-hover);border-color:var(--accent-primary);color:var(--text-primary)}.chat-messages{display:flex;flex-direction:column;gap:16px;max-width:800px;width:100%;margin:0 auto}.message{display:flex;gap:12px;animation:messageIn .3s ease}@keyframes messageIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.message.user{flex-direction:row-reverse}.message-avatar{width:36px;height:36px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center}.message.user .message-avatar{background:var(--accent-primary);color:#000}.message.assistant .message-avatar{background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--text-secondary)}.message-avatar img{width:100%;height:100%;border-radius:50%;-o-object-fit:cover;object-fit:cover}.message-content{max-width:70%;padding:12px 16px;border-radius:16px;font-size:.9375rem;line-height:1.5}.message.user .message-content{background:var(--accent-primary);color:#000;border-bottom-right-radius:4px}.message.assistant .message-content{background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--text-primary);border-bottom-left-radius:4px}.message-content p{margin:0 0 8px}.message-content p:last-child{margin-bottom:0}.message-content pre{background:#0000004d;padding:12px;border-radius:8px;overflow-x:auto;margin:8px 0}.message-content code{font-family:SF Mono,Monaco,Consolas,monospace;font-size:.875rem}.typing-indicator{display:flex;align-items:center;gap:4px;padding:8px 12px}.typing-indicator span{width:8px;height:8px;background:var(--text-tertiary);border-radius:50%;animation:typing 1.4s infinite}.typing-indicator span:nth-child(2){animation-delay:.2s}.typing-indicator span:nth-child(3){animation-delay:.4s}@keyframes typing{0%,60%,to{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-4px)}}.chat-input-container{padding:16px 24px 24px;background:var(--bg-core);border-top:1px solid var(--glass-border)}.chat-input-wrapper{display:flex;align-items:flex-end;gap:12px;max-width:800px;margin:0 auto;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:16px;padding:12px 16px;transition:border-color .2s ease}.chat-input-wrapper:focus-within{border-color:var(--accent-primary)}.chat-input-field{flex:1;background:transparent;border:none;outline:none;resize:none;font-family:Inter,sans-serif;font-size:.9375rem;line-height:1.5;color:var(--text-primary);max-height:150px;min-height:24px}.chat-input-field::-moz-placeholder{color:var(--text-tertiary)}.chat-input-field::placeholder{color:var(--text-tertiary)}.send-message-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background:var(--accent-primary);border:none;border-radius:10px;color:#000;cursor:pointer;transition:all .2s ease;flex-shrink:0}.send-message-btn:disabled{opacity:.5;cursor:not-allowed}.send-message-btn:not(:disabled):hover{opacity:.9;transform:scale(1.05)}.chat-input-footer{display:flex;justify-content:space-between;align-items:center;max-width:800px;margin:8px auto 0;padding:0 4px}.char-counter,.disclaimer{font-size:.75rem;color:var(--text-tertiary)}.sidebar-overlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:40;opacity:0;transition:opacity .3s ease}.sidebar-overlay.active{opacity:1}.auth-required-modal{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;align-items:center;justify-content:center}.auth-required-modal.active{display:flex}.auth-modal-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.auth-modal-content{position:relative;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:24px;padding:40px;max-width:420px;width:90%;text-align:center;animation:modalIn .3s ease}@keyframes modalIn{0%{opacity:0;transform:scale(.95) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}.auth-modal-icon{width:80px;height:80px;margin:0 auto 24px;display:flex;align-items:center;justify-content:center;background:#0088cc1a;border-radius:20px;color:#08c}.auth-modal-title{font-family:Plus Jakarta Sans,sans-serif;font-size:1.5rem;font-weight:600;color:var(--text-primary);margin:0 0 12px}.auth-modal-text{font-size:1rem;color:var(--text-secondary);margin:0 0 24px}.auth-modal-actions{display:flex;flex-direction:column;gap:12px;margin-bottom:24px}.auth-modal-btn{display:flex;align-items:center;justify-content:center;gap:8px;padding:14px 24px;border-radius:12px;font-weight:500;font-size:.9375rem;text-decoration:none;transition:all .2s ease;cursor:pointer;border:none}.auth-modal-btn.primary{background:#08c;color:#fff}.auth-modal-btn.primary:hover{background:#0077b5}.auth-modal-btn.secondary{background:var(--glass-bg);border:1px solid var(--glass-border);color:var(--text-secondary)}.auth-modal-btn.secondary:hover{background:var(--glass-hover);color:var(--text-primary)}.auth-modal-code-section{padding-top:20px;border-top:1px solid var(--glass-border)}.auth-modal-code-label{font-size:.875rem;color:var(--text-tertiary);margin:0 0 12px}.auth-modal-code-input-wrapper{display:flex;gap:8px}.auth-modal-code-input{flex:1;padding:12px 16px;background:var(--bg-core);border:1px solid var(--glass-border);border-radius:10px;font-size:1.125rem;font-weight:500;text-align:center;letter-spacing:.2em;color:var(--text-primary);outline:none;transition:border-color .2s ease}.auth-modal-code-input:focus{border-color:var(--accent-primary)}.auth-modal-code-submit{padding:12px 20px;background:var(--accent-primary);color:var(--bg-primary);border:none;border-radius:10px;font-weight:500;cursor:pointer;transition:opacity .2s ease}.auth-modal-code-submit:hover{opacity:.9}.auth-modal-error{display:block;margin-top:8px;font-size:.875rem;color:#ef4444}.auth-modal-error.hidden{display:none}.balance-modal{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;align-items:center;justify-content:center}.balance-modal.active{display:flex}.balance-modal-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.balance-modal-content{position:relative;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:24px;padding:40px;max-width:420px;width:90%;text-align:center;animation:modalIn .3s ease}.balance-modal-close{position:absolute;top:16px;right:16px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;color:var(--text-tertiary);cursor:pointer;transition:color .2s ease}.balance-modal-close:hover{color:var(--text-primary)}.balance-modal-icon{width:64px;height:64px;margin:0 auto 20px}.balance-modal-icon img{width:100%;height:100%;-o-object-fit:contain;object-fit:contain}.balance-modal-title{font-family:Plus Jakarta Sans,sans-serif;font-size:1.25rem;font-weight:600;color:var(--text-primary);margin:0 0 12px}.balance-modal-text{font-size:.9375rem;color:var(--text-secondary);margin:0 0 24px;line-height:1.6}.balance-modal-actions{display:flex;flex-direction:column;gap:12px}.balance-modal-btn{display:flex;align-items:center;justify-content:center;padding:14px 24px;border-radius:12px;font-weight:500;font-size:.9375rem;text-decoration:none;transition:all .2s ease;cursor:pointer;border:none}.balance-modal-btn.primary{background:var(--accent-primary);color:var(--bg-primary)}.balance-modal-btn.primary:hover{opacity:.9}.balance-modal-btn.secondary{background:transparent;border:1px solid var(--glass-border);color:var(--text-secondary)}.balance-modal-btn.secondary:hover{background:var(--glass-hover);color:var(--text-primary)}@media (max-width: 768px){.chat-sidebar{position:fixed;left:0;top:0;z-index:50;transform:translate(-100%)}.chat-sidebar.active{transform:translate(0)}.sidebar-overlay{display:block}.chat-header-mobile{display:flex}.chat-messages-container{padding:16px}.chat-input-container{padding:12px 16px 16px}.message-content{max-width:85%}.welcome-suggestions{flex-direction:column}.suggestion-chip{width:100%}.auth-modal-content,.balance-modal-content{padding:24px}}[data-theme=dark] .sun-icon{display:block}[data-theme=dark] .moon-icon,[data-theme=light] .sun-icon{display:none}[data-theme=light] .moon-icon,[data-theme=dark] .icon-dark{display:block}[data-theme=dark] .icon-light,[data-theme=light] .icon-dark{display:none}[data-theme=light] .icon-light,[data-theme=dark] .logo-dark{display:block}[data-theme=dark] .logo-light,[data-theme=light] .logo-dark{display:none}[data-theme=light] .logo-light{display:block}
