:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:#ffffffde;background-color:#0a0a0a;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body,#root{margin:0;padding:0;width:100%;height:100%}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;width:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:#0a0a0a;color:#fff}#root{height:100vh;width:100%}.loading-screen{display:flex;align-items:center;justify-content:center;height:100vh;font-size:1.2rem;color:#888}.login-container{display:flex;align-items:center;justify-content:center;height:100vh;background:linear-gradient(135deg,#1a1a2e,#0a0a0a)}.login-box{background:#1a1a1a;padding:2rem;border-radius:12px;width:100%;max-width:400px;text-align:center}.login-box h1{font-size:2rem;margin-bottom:.5rem}.login-box .subtitle{color:#888;margin-bottom:2rem}.login-box form{display:flex;flex-direction:column;gap:1rem}.login-box input{padding:.8rem 1rem;border:1px solid #333;border-radius:8px;background:#0a0a0a;color:#fff;font-size:1rem}.login-box input:focus{outline:none;border-color:#7c3aed}.login-box button[type=submit]{padding:.8rem;border:none;border-radius:8px;background:#7c3aed;color:#fff;font-size:1rem;cursor:pointer;transition:background .2s}.login-box button[type=submit]:hover{background:#6d28d9}.login-box button[type=submit]:disabled{background:#444;cursor:not-allowed}.login-box .error{color:#ef4444;font-size:.9rem}.login-box .toggle-mode{margin-top:1rem;background:none;border:none;color:#7c3aed;cursor:pointer;font-size:.9rem}.chat-container{display:flex;height:100vh;width:100%}.sidebar{width:320px;flex-shrink:0;background:#111;border-right:1px solid #222;display:flex;flex-direction:column}.sidebar-header{padding:1rem;border-bottom:1px solid #222}.sidebar-header h2{font-size:1.3rem;margin-bottom:.5rem}.user-info{display:flex;align-items:center;justify-content:space-between;font-size:.9rem;color:#888}.logout-btn{background:none;border:none;color:#ef4444;cursor:pointer;font-size:.8rem}.main-content{flex:1;min-width:0;display:flex;flex-direction:column;overflow:hidden}.no-conversation{display:flex;align-items:center;justify-content:center;height:100%;color:#666}.chat-list{flex:1;overflow-y:auto}.search-box{padding:1rem}.search-box input{width:100%;padding:.6rem 1rem;border:1px solid #333;border-radius:8px;background:#0a0a0a;color:#fff;font-size:.9rem}.search-results{padding:0 1rem 1rem;border-bottom:1px solid #222}.search-results h4{font-size:.8rem;color:#666;margin-bottom:.5rem}.search-result-item{display:flex;align-items:center;gap:.5rem;padding:.5rem;cursor:pointer;border-radius:8px}.search-result-item:hover{background:#1a1a1a}.conversations{padding:.5rem}.conversation-item{display:flex;align-items:center;gap:.75rem;padding:.75rem;cursor:pointer;border-radius:8px;transition:background .2s}.conversation-item:hover{background:#1a1a1a}.conversation-item.active{background:#7c3aed22}.conversation-item .avatar{font-size:1.5rem}.conversation-info{flex:1;min-width:0}.conversation-info .name{display:block;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.conversation-info .last-message{display:block;font-size:.8rem;color:#666;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.no-conversations{text-align:center;padding:2rem;color:#666}.chat-window{display:flex;flex-direction:column;height:100%;width:100%}.chat-header{display:flex;align-items:center;gap:.75rem;padding:1rem;border-bottom:1px solid #222;background:#111}.chat-header .avatar{font-size:1.5rem}.chat-header h3{font-weight:500}.messages-container{flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.5rem}.loading-more{text-align:center;padding:.75rem;color:#888;font-size:.85rem}.message-bubble{max-width:70%;padding:.5rem}.message-bubble.own{align-self:flex-end}.message-bubble.other{align-self:flex-start}.message-bubble .sender-name{font-size:.75rem;color:#7c3aed;margin-bottom:.25rem;display:block}.message-content{background:#1a1a1a;padding:.75rem 1rem;border-radius:12px}.message-bubble.own .message-content{background:#7c3aed}.message-content p{margin:0;word-wrap:break-word}.message-time{font-size:.7rem;color:#666;display:block;margin-top:.25rem;text-align:right}.meme-message{min-width:200px}.message-content:has(.meme-message){background:transparent;padding:0}.meme-image{max-width:300px;max-height:300px;border-radius:8px;display:block}.meme-generating{display:flex;flex-direction:column;align-items:center;padding:2rem;color:#888}.meme-generating .spinner{width:40px;height:40px;border:3px solid #333;border-top-color:#7c3aed;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}@keyframes spin{to{transform:rotate(360deg)}}.meme-prompt{font-style:italic;font-size:.9rem;margin-top:.5rem}.message-bubble.preview{opacity:.95}.message-bubble.preview .meme-image{border:2px dashed #7c3aed}.meme-preview-actions{background:#1a1a2e;padding:.75rem;border-radius:0 0 8px 8px;margin-top:-4px}.preview-label{display:block;font-size:.75rem;color:#888;margin-bottom:.5rem;text-align:center}.preview-buttons{display:flex;gap:.5rem;justify-content:center}.preview-buttons button{padding:.4rem .8rem;border:none;border-radius:6px;font-size:.85rem;cursor:pointer;transition:all .2s}.approve-btn{background:#22c55e;color:#fff}.approve-btn:hover{background:#16a34a}.regenerate-btn{background:#7c3aed;color:#fff}.regenerate-btn:hover{background:#6d28d9}.cancel-btn{background:#333;color:#888}.cancel-btn:hover{background:#444;color:#fff}.typing-indicator{display:flex;align-items:center;gap:.5rem;padding:.5rem;color:#666;font-size:.85rem}.typing-dots{display:flex;gap:3px}.typing-dots span{width:6px;height:6px;background:#666;border-radius:50%;animation:typing 1.4s infinite}.typing-dots span:nth-child(2){animation-delay:.2s}.typing-dots span:nth-child(3){animation-delay:.4s}@keyframes typing{0%,60%,to{transform:translateY(0)}30%{transform:translateY(-4px)}}.message-input-container{padding:1rem;border-top:1px solid #222;background:#111}.message-input-container.meme-mode{background:#1a0a2e}.meme-mode-banner{display:flex;align-items:center;justify-content:space-between;padding:.5rem 1rem;background:#7c3aed33;border-radius:8px;margin-bottom:.5rem;font-weight:500}.close-meme-mode{background:none;border:none;color:#fff;cursor:pointer;font-size:1rem}.message-form{display:flex;gap:.5rem;align-items:flex-end}.meme-inputs{flex:1;display:flex;flex-direction:column;gap:.5rem}.meme-inputs input{width:100%;padding:.6rem 1rem;border:1px solid #333;border-radius:8px;background:#0a0a0a;color:#fff;font-size:.9rem}.meme-inputs input:focus{outline:none;border-color:#7c3aed}.meme-format-input::placeholder{color:#7c3aed99}.meme-text-input::placeholder{color:#888}.meme-toggle{width:44px;height:44px;border:none;border-radius:8px;background:#1a1a1a;font-size:1.3rem;cursor:pointer;transition:background .2s}.meme-toggle:hover{background:#333}.meme-toggle.active{background:#7c3aed}.message-form input{flex:1;padding:.75rem 1rem;border:1px solid #333;border-radius:8px;background:#0a0a0a;color:#fff;font-size:1rem}.message-form input:focus{outline:none;border-color:#7c3aed}.send-button{width:44px;height:44px;border:none;border-radius:8px;background:#7c3aed;color:#fff;font-size:1.2rem;cursor:pointer;transition:background .2s}.send-button:hover{background:#6d28d9}.send-button:disabled{background:#333;cursor:not-allowed}.input-hint{margin-top:.5rem;font-size:.75rem;color:#555;text-align:center}.meme-editor-overlay{position:fixed;inset:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:1000}.meme-editor-modal{background:#1a1a1a;border-radius:12px;width:90%;max-width:600px;max-height:90vh;display:flex;flex-direction:column;overflow:hidden}.meme-editor-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;border-bottom:1px solid #333}.meme-editor-header h3{margin:0;font-size:1.1rem}.meme-editor-header .close-btn{background:none;border:none;color:#888;font-size:1.5rem;cursor:pointer;padding:0;line-height:1}.meme-editor-header .close-btn:hover{color:#fff}.meme-editor-content{flex:1;overflow-y:auto;padding:1rem 1.25rem}.meme-editor-search{position:relative;margin-bottom:1rem}.meme-editor-search input{width:100%;padding:.75rem 1rem;border:1px solid #333;border-radius:8px;background:#0a0a0a;color:#fff;font-size:.95rem}.meme-editor-search input:focus{outline:none;border-color:#7c3aed}.meme-editor-search .searching,.meme-editor-search .result-count{position:absolute;right:1rem;top:50%;transform:translateY(-50%);color:#7c3aed;font-size:.8rem}.meme-editor-search .result-count{color:#666}.template-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.75rem;margin-bottom:1rem;min-height:150px;max-height:300px;overflow-y:auto;padding-right:.5rem}.template-item{background:#222;border-radius:8px;overflow:hidden;cursor:pointer;border:2px solid transparent;transition:all .2s}.template-item:hover{border-color:#444}.template-item.selected{border-color:#7c3aed}.template-item img{width:100%;aspect-ratio:1;object-fit:cover}.template-item .template-name{display:block;padding:.5rem;font-size:.75rem;color:#aaa;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.no-templates{grid-column:1 / -1;text-align:center;color:#666;padding:2rem}.load-more-sentinel{grid-column:1 / -1;text-align:center;color:#7c3aed;padding:1rem;min-height:40px}.template-grid::-webkit-scrollbar{width:6px}.template-grid::-webkit-scrollbar-track{background:#1a1a1a;border-radius:3px}.template-grid::-webkit-scrollbar-thumb{background:#444;border-radius:3px}.template-grid::-webkit-scrollbar-thumb:hover{background:#555}.meme-text-inputs{display:flex;flex-direction:column;gap:.75rem}.meme-text-inputs input{width:100%;padding:.75rem 1rem;border:1px solid #333;border-radius:8px;background:#0a0a0a;color:#fff;font-size:.95rem}.meme-text-inputs input:focus{outline:none;border-color:#7c3aed}.meme-editor-footer{display:flex;justify-content:flex-end;gap:.75rem;padding:1rem 1.25rem;border-top:1px solid #333}.meme-editor-footer .cancel-btn{padding:.6rem 1.25rem;border:none;border-radius:8px;background:#333;color:#aaa;font-size:.9rem;cursor:pointer;transition:all .2s}.meme-editor-footer .cancel-btn:hover{background:#444;color:#fff}.meme-editor-footer .generate-btn{padding:.6rem 1.25rem;border:none;border-radius:8px;background:#7c3aed;color:#fff;font-size:.9rem;cursor:pointer;transition:background .2s}.meme-editor-footer .generate-btn:hover{background:#6d28d9}.meme-editor-footer .generate-btn:disabled{background:#444;color:#666;cursor:not-allowed}.image-viewer-overlay{position:fixed;inset:0;background:#000000f2;display:flex;align-items:center;justify-content:center;z-index:2000;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.image-viewer-close{position:absolute;top:1rem;right:1rem;background:none;border:none;color:#fff;font-size:2.5rem;cursor:pointer;padding:.5rem;line-height:1;opacity:.7;transition:opacity .2s;z-index:2001}.image-viewer-close:hover{opacity:1}.image-viewer-container{max-width:90vw;max-height:90vh;display:flex;align-items:center;justify-content:center}.image-viewer-img{max-width:100%;max-height:90vh;object-fit:contain;border-radius:8px;box-shadow:0 10px 50px #00000080}.meme-image{cursor:pointer}.message-bubble:not(.preview) .meme-image:hover{opacity:.95}