*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--bg-primary: #121212;--bg-secondary: #1E1E1E;--bg-tertiary: #2C2C2C;--text-primary: #E0E0E0;--text-secondary: #A0A0A0;--accent-color: #4A90E2;--error-color: #ff5252;--success-color: #4caf50}html,body{height:100%;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;background-color:var(--bg-primary);color:var(--text-primary);line-height:1.6}#root{display:flex;flex-direction:column;height:100vh;max-width:800px;margin:0 auto;background-color:var(--bg-primary)}.chat-shell{display:flex;flex-direction:column;height:100vh;width:100%;max-width:800px;margin:0 auto;background-color:var(--bg-primary)}.light-mode{--bg-primary: #f5f5f5;--bg-secondary: #e9e9e9;--bg-tertiary: #ffffff;--text-primary: #333333;--text-secondary: #666666}header{display:flex;justify-content:space-between;align-items:center;padding:1rem;background-color:var(--bg-secondary);color:var(--text-primary)}.dark-mode-toggle{background:none;border:none;font-size:1.5rem;cursor:pointer}main{flex-grow:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;background-color:var(--bg-primary)}.bubble{max-width:80%;margin-bottom:1rem;padding:1rem;border-radius:12px;background-color:var(--bg-tertiary);word-wrap:break-word;align-self:flex-start}.bubble.user{background-color:var(--accent-color);align-self:flex-end;margin-left:auto}.bubble.assistant{background-color:var(--bg-secondary);align-self:flex-start;margin-right:auto}.image-container{display:flex;flex-direction:column;gap:16px;margin-top:12px}.image-pair{display:flex;flex-wrap:wrap;gap:12px}.image-wrapper{position:relative;max-width:240px;border-radius:8px;overflow:hidden;border:1px solid var(--bg-secondary)}.image-wrapper.edited{border:1px solid var(--accent-color)}.image-wrapper img{width:100%;height:auto;object-fit:cover;cursor:pointer;display:block}.image-label{position:absolute;top:8px;right:8px;background-color:#0009;color:#fff;padding:4px 8px;border-radius:4px;font-size:12px}.editing-placeholder{display:flex;flex-direction:column;justify-content:center;align-items:center;width:240px;height:240px;background-color:var(--bg-tertiary);border-radius:8px}.editing-text{margin-top:12px;font-size:14px;color:var(--text-secondary)}footer{display:flex;padding:1rem;background-color:var(--bg-secondary)}footer input{flex-grow:1;padding:.5rem;margin-right:.5rem;border:none;border-radius:4px;background-color:var(--bg-tertiary);color:var(--text-primary)}footer button{padding:.5rem 1rem;background-color:var(--accent-color);color:#fff;border:none;border-radius:4px;cursor:pointer}.aspect-ratio-selector{display:flex;justify-content:center;align-items:center;padding:.5rem;background-color:var(--bg-secondary);color:var(--text-primary)}.aspect-ratio-selector select{background-color:var(--bg-tertiary);color:var(--text-primary);border:none;border-radius:4px;padding:.5rem;margin-left:10px}.editing-spinner{width:40px;height:40px;border:4px solid rgba(255,255,255,.3);border-top:4px solid var(--accent-color);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.copy{text-align:center;padding:.5rem;font-size:.8rem;color:var(--text-secondary);background-color:var(--bg-secondary)}@media(max-width:600px){#root,.chat-shell{width:100%;max-width:100%}.bubble{max-width:90%}.image-wrapper{max-width:100%}.image-pair{flex-direction:column}.editing-placeholder{width:100%;height:200px}}.image-modal{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000c;display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background-color:var(--bg-secondary);color:var(--text-primary);border-radius:12px;width:90%;max-width:800px;max-height:90vh;overflow-y:auto;padding:20px;position:relative}.close-btn{position:absolute;top:10px;right:10px;background:none;border:none;font-size:24px;color:var(--text-primary);cursor:pointer}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--accent-color);border-radius:5px}::-webkit-scrollbar-thumb:hover{background:#5a9bd5}