:root{--bg-color: #050505;--surface-color: #1a1a1a;--surface-hover: #2a2a2a;--text-primary: #ffffff;--text-secondary: #a0a0a0;--accent-primary: #8b5cf6;--accent-secondary: #d946ef;--accent-glow: rgba(139, 92, 246, .4);--border-color: rgba(255, 255, 255, .1);--input-bg: rgba(255, 255, 255, .05);--inverse-text: #000;--brand-text-grad: linear-gradient(to right, #fff, #a0a0a0);--prompt-bg: #000;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 24px;--transition-fast: .2s ease;--transition-smooth: .4s cubic-bezier(.16, 1, .3, 1)}[data-theme=light]{--bg-color: #f9fafb;--surface-color: #ffffff;--surface-hover: #f3f4f6;--text-primary: #111827;--text-secondary: #4b5563;--accent-primary: #7c3aed;--accent-secondary: #c026d3;--accent-glow: rgba(124, 58, 237, .2);--border-color: rgba(0, 0, 0, .1);--input-bg: rgba(0, 0, 0, .05);--inverse-text: #fff;--brand-text-grad: linear-gradient(to right, #111827, #4b5563);--prompt-bg: #f3f4f6}[data-theme=dark]{--bg-color: #050505;--surface-color: #1a1a1a;--surface-hover: #2a2a2a;--text-primary: #ffffff;--text-secondary: #a0a0a0;--accent-primary: #8b5cf6;--accent-secondary: #d946ef;--accent-glow: rgba(139, 92, 246, .4);--border-color: rgba(255, 255, 255, .1);--input-bg: rgba(255, 255, 255, .05);--inverse-text: #000;--brand-text-grad: linear-gradient(to right, #fff, #a0a0a0);--prompt-bg: #000}*{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,-apple-system,sans-serif;background-color:var(--bg-color);color:var(--text-primary);min-height:100vh;overflow-x:hidden;line-height:1.5;-webkit-font-smoothing:antialiased}button{background:none;border:none;cursor:pointer;font-family:inherit;color:inherit;outline:none}h1,h2,h3,h4{font-weight:600;letter-spacing:-.02em}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-color)}::-webkit-scrollbar-thumb{background:var(--surface-hover);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--border-color)}.app-container{display:grid;grid-template-columns:350px 1fr;min-height:100vh;gap:2rem;padding:2rem;width:100%;max-width:100%;margin:0 auto}.brand{display:flex;align-items:center;gap:1rem;margin-bottom:2rem}.brand-icon{width:40px;height:40px;background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.2rem;color:#fff}.brand-text h1{font-size:1.5rem;background:var(--brand-text-grad);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.sidebar{background:var(--surface-color);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:1.5rem;display:flex;flex-direction:column;gap:2rem;height:calc(100vh - 4rem);position:sticky;top:2rem;overflow-y:auto}.section-title{font-size:.9rem;text-transform:uppercase;color:var(--text-secondary);letter-spacing:.05em;margin-bottom:1rem}.form-group{display:flex;flex-direction:column;gap:.5rem;margin-bottom:1.5rem}.form-label{font-size:.9rem;font-weight:500}.form-select,.form-input{width:100%;background:var(--input-bg);border:1px solid var(--border-color);border-radius:var(--radius-sm);padding:.75rem 1rem;color:var(--text-primary);font-size:.9rem;transition:var(--transition-fast)}.form-select:focus,.form-input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 2px #8b5cf633;outline:none}option{background:var(--surface-color);color:var(--text-primary)}.lens-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;margin-top:.25rem}.lens-option{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25rem;padding:.75rem .25rem;background:var(--input-bg);border:1px solid var(--border-color);border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition-fast);text-align:center}.lens-option:hover{border-color:var(--accent-primary);background:var(--surface-hover)}.lens-option input[type=radio]{position:absolute;opacity:0;width:0;height:0}.lens-option.active{border-color:var(--accent-primary);background:#8b5cf626}.lens-option .lens-icon{color:var(--text-primary);margin-bottom:.25rem}.lens-option .lens-label{font-size:.8rem;font-weight:500;color:var(--text-primary)}.lens-option .lens-desc{font-size:.65rem;color:var(--text-secondary);line-height:1.1}.upload-zone{border:2px dashed var(--border-color);border-radius:var(--radius-md);padding:2rem 1rem;text-align:center;color:var(--text-secondary);cursor:pointer;transition:var(--transition-fast);display:flex;flex-direction:column;align-items:center;gap:1rem}.upload-zone:hover{border-color:var(--accent-primary);background:#8b5cf60d;color:var(--text-primary)}.upload-icon{font-size:2rem;color:var(--accent-primary)}.preview-area{display:flex;flex-direction:column;gap:1.5rem;width:100%}.preview-header{display:flex;justify-content:space-between;align-items:center;background:var(--surface-color);padding:1rem 1.5rem;border-radius:var(--radius-md);border:1px solid var(--border-color);flex-wrap:wrap;gap:1rem}.prompt-display{font-family:monospace;background:var(--prompt-bg);padding:1rem;border-radius:var(--radius-sm);color:var(--accent-secondary);font-size:.85rem;line-height:1.5;border:1px solid var(--border-color);white-space:pre-wrap;word-break:break-word}.btn-primary{background:linear-gradient(135deg,var(--accent-primary),var(--accent-secondary));color:#fff;padding:.75rem 1.5rem;border-radius:var(--radius-sm);font-weight:600;font-size:1rem;transition:var(--transition-fast);display:flex;align-items:center;justify-content:center;gap:.5rem;box-shadow:0 4px 15px var(--accent-glow)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #8b5cf699}.btn-primary:active{transform:translateY(0)}.btn-primary:disabled{opacity:.7;cursor:not-allowed;transform:none}.showcase{flex:1;background:var(--surface-color);border:1px solid var(--border-color);border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;min-height:400px}.showcase:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,rgba(139,92,246,.1) 0%,transparent 70%);pointer-events:none}.showcase-placeholder{display:flex;flex-direction:column;align-items:center;gap:1rem;color:var(--text-secondary)}.generated-image{width:100%;height:100%;object-fit:contain;animation:fadeIn .5s ease-out forwards}.thumbnail-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:1rem;margin-top:1.5rem}.thumbnail{aspect-ratio:1;border-radius:var(--radius-sm);overflow:hidden;border:2px solid transparent;cursor:pointer;transition:var(--transition-fast)}.thumbnail img{width:100%;height:100%;object-fit:cover}.thumbnail:hover,.thumbnail.active{border-color:var(--accent-primary)}.loader{width:48px;height:48px;border:5px solid rgba(139,92,246,.2);border-bottom-color:var(--accent-primary);border-radius:50%;display:inline-block;box-sizing:border-box;animation:rotation 1s linear infinite}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}@media(max-width:1024px){.app-container{grid-template-columns:1fr;padding:1rem}.sidebar{height:auto;position:static}}