@import"https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&family=Inter:wght@300;400;500;600;700&display=swap";.demo-window{width:100%;max-width:600px;background:#fff;border:1px solid #e2e8f0;border-top:3px solid #10b981;border-radius:16px;box-shadow:0 20px 40px #00000014;overflow:hidden}.demo-header{display:flex;align-items:center;padding:12px 16px;background:#fafafa;border-bottom:1px solid #f1f5f9}.demo-dots{display:flex;gap:6px}.demo-dots span{width:10px;height:10px;border-radius:50%}.demo-dots span:nth-child(1){background:#ff5f57}.demo-dots span:nth-child(2){background:#febc2e}.demo-dots span:nth-child(3){background:#28c840}.demo-title{flex:1;text-align:center;font-size:13px;font-weight:600;color:#64748b}.demo-content{padding:20px}.demo-interactive{display:flex;flex-direction:column;gap:20px}.demo-main-image{position:relative;width:100%;aspect-ratio:16 / 10;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;overflow:hidden}.demo-image{width:100%;height:100%;object-fit:contain;padding:8px;transition:filter .3s ease}.demo-image-loading{filter:blur(6px) brightness(.8)}.demo-image-done{animation:fadeIn .4s ease}@keyframes fadeIn{0%{opacity:.6}to{opacity:1}}.demo-loading-overlay{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;background:#ffffffd9}.demo-spinner{display:flex;flex-direction:column;align-items:center;gap:10px}.spinner-ring{width:36px;height:36px;border:3px solid #d1fae5;border-top-color:#10b981;border-radius:50%;animation:spin .8s linear infinite}.demo-spinner span{font-size:14px;font-weight:600;color:#10b981}.demo-toggle-container{position:absolute;bottom:12px;left:50%;transform:translate(-50%);display:flex;padding:4px;background:#0f172ae6;border-radius:8px;z-index:10}.demo-toggle-btn{padding:6px 14px;border:none;border-radius:6px;font-size:12px;font-weight:600;cursor:pointer;background:transparent;color:#fff9;transition:all .2s ease}.demo-toggle-btn:hover{color:#fff}.demo-toggle-btn.active{background:#10b981;color:#fff}.demo-controls{display:flex;align-items:center;gap:12px;padding:12px;background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px}.demo-object-pill{display:flex;align-items:center;gap:10px;padding:6px 12px 6px 6px;background:#fff;border:1px solid #e2e8f0;border-radius:10px;flex-shrink:0}.pill-thumbnail{width:40px;height:40px;object-fit:contain;background:#f8fafc;border:1px solid #f1f5f9;border-radius:6px;padding:3px}.pill-info{display:flex;flex-direction:column}.pill-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:#94a3b8}.pill-name{font-size:14px;font-weight:700;color:#10b981}.demo-prompt-input{flex:1;min-width:0;padding:10px 12px;background:#fff;border:1px solid #e2e8f0;border-radius:8px;overflow:hidden}.demo-prompt-input .prompt-text{font-size:13px;font-style:italic;color:#64748b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.demo-edit-btn{display:flex;align-items:center;justify-content:center;gap:6px;padding:10px 18px;border:none;border-radius:8px;font-size:14px;font-weight:700;cursor:pointer;flex-shrink:0;min-width:90px;height:40px;transition:background .2s ease}.demo-edit-btn-ready{background:#10b981;color:#fff;animation:pulse 2s infinite}@keyframes pulse{0%,to{box-shadow:0 0 #10b98180}50%{box-shadow:0 0 0 8px #10b98100}}.demo-edit-btn-ready:hover{background:#059669;animation:none}.demo-edit-btn-loading{background:#e2e8f0;color:#94a3b8;cursor:not-allowed}.demo-edit-btn-done{background:#22c55e;color:#fff}.edit-result-toast{position:absolute;bottom:calc(100% + 10px);left:12px;display:flex;align-items:center;gap:8px;padding:10px 14px;background:#fff;border:1px solid #e2e8f0;border-radius:10px;box-shadow:0 8px 20px #0000001a;z-index:20;animation:slideUp .3s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.toast-icon{width:22px;height:22px;display:flex;align-items:center;justify-content:center;background:#dcfce7;color:#22c55e;border-radius:50%}.toast-content{display:flex;flex-direction:column}.toast-title{font-size:13px;font-weight:700;color:#1e293b}.toast-time{font-size:11px;color:#94a3b8}@media(max-width:640px){.demo-window{border-radius:12px}.demo-header{padding:10px 12px}.demo-dots span{width:8px;height:8px}.demo-title{font-size:12px}.demo-content{padding:16px}.demo-interactive{gap:16px}.demo-main-image{aspect-ratio:4 / 3}.demo-controls{flex-direction:column;gap:10px;align-items:stretch}.demo-object-pill{justify-content:flex-start}.demo-edit-btn{width:100%}}.landing{min-height:100vh;position:relative;overflow-x:hidden;background:linear-gradient(180deg,#f8faf9,#fff 30%)}.landing-bg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;pointer-events:none}.bg-gradient{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 80% 50% at 50% 0%,rgba(16,185,129,.06) 0%,transparent 50%),radial-gradient(ellipse 60% 40% at 80% 20%,rgba(20,184,166,.04) 0%,transparent 40%)}.bg-pattern{position:absolute;top:0;right:0;bottom:0;left:0;opacity:.02;background-image:linear-gradient(rgba(16,185,129,.3) 1px,transparent 1px),linear-gradient(90deg,rgba(16,185,129,.3) 1px,transparent 1px);background-size:60px 60px;-webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 20%,black,transparent);mask-image:radial-gradient(ellipse 80% 60% at 50% 20%,black,transparent)}.landing-nav{position:fixed;top:16px;left:24px;right:24px;z-index:100;max-width:1200px;margin:0 auto;padding:12px 20px;background:#ffffffb3;backdrop-filter:blur(20px) saturate(1.4);-webkit-backdrop-filter:blur(20px) saturate(1.4);border:1px solid rgba(255,255,255,.5);border-radius:16px;box-shadow:0 4px 24px #0f172a0f}.nav-container{display:flex;align-items:center;justify-content:space-between;gap:24px}.nav-logo{display:flex;align-items:center;gap:10px;cursor:pointer}.nav-logo-mark{width:36px;height:36px;display:flex;align-items:center;justify-content:center}.nav-logo-text{display:flex;flex-direction:column}.nav-brand{font-family:var(--font-display);font-size:1.375rem;font-weight:600;color:var(--color-text-primary);line-height:1.1;letter-spacing:-.02em}.nav-tagline{font-size:.625rem;font-weight:500;color:var(--color-accent);text-transform:uppercase;letter-spacing:.15em}.nav-links{display:flex;align-items:center;gap:4px}.nav-link{padding:8px 14px;background:transparent;border:none;color:var(--color-text-secondary);font-size:.875rem;font-weight:500;cursor:pointer;border-radius:var(--radius-sm);transition:all .15s ease}.nav-link:hover{color:var(--color-text-primary);background:var(--color-bg-hover)}.nav-actions{display:flex;align-items:center;gap:12px}.nav-cta{padding:10px 20px;min-width:150px;background:var(--color-accent);border:none;border-radius:var(--radius-md);color:var(--color-accent-contrast);font-size:.875rem;font-weight:600;cursor:pointer;transition:background .15s ease,transform .15s ease;text-align:center;display:flex;align-items:center;justify-content:center;gap:8px}.nav-cta .loading-spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .8s linear infinite}.nav-cta:hover:not(:disabled){background:var(--color-accent-hover);transform:translateY(-1px)}.nav-cta:disabled{cursor:default}.hero-section{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:120px 24px 80px}.hero-wrapper{width:100%;max-width:1200px;display:flex;align-items:center;gap:60px}.hero-text{flex:1;max-width:500px}.hero-badge{display:inline-flex;align-items:center;gap:8px;padding:6px 14px 6px 10px;background:var(--color-accent-subtle);border:1px solid rgba(16,185,129,.15);border-radius:100px;margin-bottom:24px}.badge-icon{color:var(--color-accent);display:flex}.hero-badge span:last-child{font-size:.8125rem;font-weight:500;color:var(--color-accent)}.hero-title{font-family:var(--font-display);font-size:clamp(2.5rem,4.5vw,3.5rem);font-weight:600;line-height:1.1;letter-spacing:-.02em;color:var(--color-text-primary);margin-bottom:20px}.title-gradient{background:linear-gradient(135deg,var(--color-accent) 0%,var(--color-accent-bright) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-description{font-size:1.0625rem;line-height:1.7;color:var(--color-text-secondary);margin-bottom:32px}.hero-cta{display:flex;flex-direction:column;gap:12px}.btn-primary-lg{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:16px 32px;background:var(--color-accent);border:none;border-radius:var(--radius-md);color:var(--color-accent-contrast);font-size:1rem;font-weight:600;cursor:pointer;transition:all .15s ease;width:fit-content}.btn-primary-lg:hover{background:var(--color-accent-hover);transform:translateY(-2px);box-shadow:0 8px 24px #10b98140}.cta-note{font-size:.8125rem;color:var(--color-text-muted)}.hero-demo{flex:1;display:flex;justify-content:center;align-items:center;max-width:620px}.metrics-section{padding:32px 0;border-top:1px solid var(--color-border-subtle);border-bottom:1px solid var(--color-border-subtle);background:var(--color-bg-secondary)}.metrics-container{max-width:900px;margin:0 auto;padding:0 32px;display:flex;align-items:center;justify-content:center;gap:48px}.metric-item{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}.metric-value{font-family:var(--font-display);font-size:2rem;font-weight:700;color:var(--color-text-primary)}.metric-label{font-size:.8125rem;color:var(--color-text-tertiary)}.metric-divider{width:1px;height:48px;background:var(--color-border)}.section-container{max-width:1120px;margin:0 auto;padding:0 32px}.section-container--narrow{max-width:800px}.section-header{text-align:center;margin-bottom:40px}.section-label{display:inline-block;font-size:.75rem;font-weight:600;color:var(--color-accent);text-transform:uppercase;letter-spacing:.12em;margin-bottom:12px}.section-title{font-family:var(--font-display);font-size:clamp(1.75rem,3.5vw,2.5rem);font-weight:600;line-height:1.2;color:var(--color-text-primary);margin-bottom:12px}.section-subtitle{font-size:1.0625rem;color:var(--color-text-secondary);max-width:560px;margin:0 auto;line-height:1.6}.how-section{padding:64px 0}.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}.step-card{text-align:center;padding:32px 24px}.step-number{width:32px;height:32px;margin:0 auto 20px;display:flex;align-items:center;justify-content:center;background:var(--color-accent);border-radius:50%;font-size:.875rem;font-weight:700;color:var(--color-accent-contrast)}.step-icon{width:64px;height:64px;margin:0 auto 20px;display:flex;align-items:center;justify-content:center;background:var(--color-accent-subtle);border:1px solid rgba(16,185,129,.1);border-radius:var(--radius-lg);color:var(--color-accent)}.step-card h3{font-family:var(--font-display);font-size:1.125rem;font-weight:600;color:var(--color-text-primary);margin-bottom:10px}.step-card p{font-size:.9375rem;color:var(--color-text-secondary);line-height:1.6}.features-section{padding:64px 0;background:linear-gradient(180deg,var(--color-bg-secondary) 0%,transparent 100%)}.features-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}.feature-card{padding:28px;background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);transition:all .2s ease}.feature-card:hover{border-color:var(--color-accent-muted);transform:translateY(-2px);box-shadow:var(--shadow-md)}.feature-card--large{grid-column:span 2}.feature-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--color-accent-subtle);border:1px solid rgba(16,185,129,.1);border-radius:var(--radius-md);color:var(--color-accent);margin-bottom:16px}.feature-card h3{font-family:var(--font-display);font-size:1.125rem;font-weight:600;color:var(--color-text-primary);margin-bottom:8px}.feature-card p{font-size:.9375rem;line-height:1.6;color:var(--color-text-secondary)}.feature-example{margin-top:16px;padding-top:16px;border-top:1px solid var(--color-border-subtle)}.example-label{display:block;font-size:.75rem;font-weight:500;color:var(--color-text-muted);margin-bottom:10px}.example-chips{display:flex;flex-wrap:wrap;gap:8px}.example-chips span{padding:6px 12px;background:var(--color-bg-tertiary);border-radius:var(--radius-sm);font-size:.8125rem;color:var(--color-text-secondary)}.usecases-section{padding:64px 0}.usecases-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.usecase-card{padding:24px;background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);transition:all .2s ease}.usecase-card:hover{border-color:var(--color-accent-muted);transform:translateY(-2px)}.usecase-icon{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:var(--color-accent-subtle);border-radius:var(--radius-md);color:var(--color-accent);margin-bottom:16px}.usecase-card h3{font-size:1rem;font-weight:600;color:var(--color-text-primary);margin-bottom:8px}.usecase-card p{font-size:.875rem;line-height:1.5;color:var(--color-text-secondary)}.testimonials-section{padding:64px 0;background:var(--color-bg-secondary)}.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.testimonial-card{padding:28px;background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);display:flex;flex-direction:column}.testimonial-stars{display:flex;gap:2px;color:#f59e0b;margin-bottom:16px}.testimonial-text{font-size:.9375rem;line-height:1.6;color:var(--color-text-secondary);margin-bottom:20px;flex:1}.testimonial-author{display:flex;align-items:center;gap:12px;margin-top:auto}.author-avatar{width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:var(--color-accent);border-radius:50%;font-size:.75rem;font-weight:600;color:var(--color-accent-contrast)}.author-info{display:flex;flex-direction:column;gap:2px}.author-name{font-size:.875rem;font-weight:600;color:var(--color-text-primary)}.author-role{font-size:.75rem;color:var(--color-text-tertiary)}.pricing-section{padding:64px 0}.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:start}.pricing-card{padding:32px;background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-xl);position:relative}.pricing-card--popular{border-color:var(--color-accent);box-shadow:0 8px 32px #10b98126}.popular-badge{position:absolute;top:-12px;left:50%;transform:translate(-50%);padding:4px 16px;background:var(--color-accent);border-radius:100px;font-size:.6875rem;font-weight:600;color:var(--color-accent-contrast);text-transform:uppercase;letter-spacing:.05em}.pricing-header{text-align:center;margin-bottom:24px;padding-bottom:24px;border-bottom:1px solid var(--color-border-subtle)}.pricing-header h3{font-size:1.125rem;font-weight:600;color:var(--color-text-primary);margin-bottom:12px}.pricing-price{display:flex;align-items:baseline;justify-content:center;gap:4px}.price-amount{font-family:var(--font-display);font-size:2.5rem;font-weight:700;color:var(--color-text-primary)}.price-period{font-size:.875rem;color:var(--color-text-tertiary)}.pricing-features{list-style:none;padding:0;margin:0 0 28px;display:flex;flex-direction:column;gap:12px}.pricing-features li{display:flex;align-items:center;gap:10px;font-size:.875rem;color:var(--color-text-secondary)}.pricing-features svg{color:var(--color-success);flex-shrink:0}.btn-pricing{width:100%;padding:12px 20px;background:transparent;border:1px solid var(--color-border);border-radius:var(--radius-md);font-size:.875rem;font-weight:600;color:var(--color-text-primary);cursor:pointer;transition:all .15s ease}.btn-pricing:hover{background:var(--color-bg-hover);border-color:var(--color-border-accent)}.btn-pricing--primary{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-accent-contrast)}.btn-pricing--primary:hover{background:var(--color-accent-hover);border-color:var(--color-accent-hover)}.faq-section{padding:64px 0;background:var(--color-bg-secondary)}.faq-list{display:flex;flex-direction:column;gap:12px}.faq-item{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);overflow:hidden}.faq-question{width:100%;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 24px;background:transparent;border:none;text-align:left;font-size:1rem;font-weight:500;color:var(--color-text-primary);cursor:pointer;transition:background .15s ease}.faq-question:hover{background:var(--color-bg-hover)}.faq-question svg{flex-shrink:0;color:var(--color-text-tertiary);transition:transform .2s ease}.faq-item--open .faq-question svg{transform:rotate(180deg)}.faq-answer{max-height:0;overflow:hidden;transition:max-height .3s ease}.faq-item--open .faq-answer{max-height:300px}.faq-answer p{padding:16px 24px 20px;font-size:.9375rem;line-height:1.6;color:var(--color-text-secondary)}.final-cta-section{padding:56px 0}.final-cta-container{max-width:800px;margin:0 auto;padding:0 32px}.final-cta-content{text-align:center;padding:56px 48px;background:linear-gradient(135deg,#10b9810f,#14b8a608);border:1px solid rgba(16,185,129,.15);border-radius:var(--radius-xl)}.final-cta-content h2{font-family:var(--font-display);font-size:clamp(1.5rem,3vw,2rem);font-weight:600;color:var(--color-text-primary);margin-bottom:12px}.final-cta-content p{font-size:1rem;color:var(--color-text-secondary);max-width:480px;margin:0 auto 28px;line-height:1.6}.landing-footer{padding:48px 0 24px;border-top:1px solid var(--color-border-subtle)}.footer-container{max-width:1120px;margin:0 auto;padding:0 32px}.footer-main{display:flex;justify-content:space-between;gap:48px;padding-bottom:32px;border-bottom:1px solid var(--color-border-subtle);margin-bottom:16px}.footer-brand{max-width:280px}.footer-logo{display:flex;align-items:center;gap:10px;color:var(--color-text-primary);margin-bottom:12px}.footer-logo span{font-family:var(--font-display);font-size:1.125rem;font-weight:600}.footer-brand p{font-size:.875rem;color:var(--color-text-tertiary);line-height:1.5}.footer-links-group{display:flex;gap:64px}.footer-links-col{display:flex;flex-direction:column;gap:12px}.footer-links-col h4{font-size:.75rem;font-weight:600;color:var(--color-text-muted);text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px}.footer-links-col button,.footer-links-col a{background:none;border:none;padding:0;font-size:.875rem;color:var(--color-text-secondary);text-decoration:none;cursor:pointer;text-align:left;transition:color .15s ease}.footer-links-col button:hover,.footer-links-col a:hover{color:var(--color-text-primary)}.footer-bottom{text-align:center}.footer-bottom p{font-size:.8125rem;color:var(--color-text-muted)}@media(max-width:1024px){.hero-wrapper{flex-direction:column;gap:48px;text-align:center}.hero-text{max-width:600px;margin:0 auto}.hero-badge{justify-content:center}.hero-cta{align-items:center}.hero-demo{max-width:100%;width:100%}.usecases-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.landing-nav{top:12px;left:12px;right:12px;padding:10px 16px}.nav-links{display:none}.hero-section{padding:100px 16px 60px}.hero-wrapper{gap:32px}.metrics-container{flex-wrap:wrap;gap:24px}.metric-divider{display:none}.metric-item{min-width:100px}.steps-grid{grid-template-columns:1fr;gap:24px}.features-grid{grid-template-columns:1fr}.feature-card--large{grid-column:span 1}.usecases-grid,.testimonials-grid{grid-template-columns:1fr}.pricing-grid{grid-template-columns:1fr;max-width:400px;margin:0 auto}.footer-main{flex-direction:column;gap:40px}.footer-links-group{gap:40px}}@media(max-width:480px){.landing-nav{top:10px;left:10px;right:10px;padding:8px 12px}.nav-logo-text{display:none}.nav-cta{padding:8px 14px;font-size:.8125rem}.hero-title{font-size:2rem}.section-container{padding:0 16px}.final-cta-content{padding:40px 24px}.footer-container{padding:0 16px}}.auth-page{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:20px;overflow-y:auto}.auth-background{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0}.auth-gradient{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 80% 50% at 50% 100%,rgba(37,99,235,.12) 0%,transparent 55%),radial-gradient(ellipse 60% 40% at 30% 90%,rgba(20,184,166,.1) 0%,transparent 45%),linear-gradient(180deg,#f6f8fb,#eef2f8 60%,#e9eef6)}.auth-glow{position:absolute;bottom:-150px;left:50%;transform:translate(-50%);width:500px;height:300px;background:radial-gradient(ellipse 100% 100% at 50% 100%,rgba(37,99,235,.22) 0%,rgba(20,184,166,.12) 30%,transparent 70%);animation:pulse-auth 4s ease-in-out infinite}@keyframes pulse-auth{0%,to{opacity:.7}50%{opacity:1}}.auth-card{position:relative;z-index:10;width:100%;max-width:420px;padding:40px;background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:20px;box-shadow:var(--shadow-lg)}.auth-logo{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:32px;cursor:pointer;transition:opacity .2s ease}.auth-logo:hover{opacity:.8}.auth-logo-icon{width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:var(--color-accent-subtle);border:1px solid var(--color-accent-muted);border-radius:12px;color:var(--color-accent)}.auth-logo-text{display:flex;flex-direction:column;gap:0}.auth-brand{font-family:var(--font-display);font-size:1.375rem;font-weight:600;color:var(--color-text-primary);line-height:1.1;letter-spacing:-.01em}.auth-tag{font-size:.625rem;font-weight:500;color:var(--color-accent);text-transform:uppercase;letter-spacing:.15em}.auth-header{text-align:center;margin-bottom:24px}.auth-title{font-size:1.75rem;font-weight:700;color:var(--color-text-primary);margin:0 0 8px;letter-spacing:-.02em}.auth-subtitle{font-size:.9375rem;color:var(--color-text-secondary);margin:0;line-height:1.5}.auth-message{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;border-radius:10px;font-size:.875rem}.auth-message--error{background:#dc262626;border:1px solid rgba(220,38,38,.3);color:#fca5a5}.auth-message--success{background:#22c55e26;border:1px solid rgba(34,197,94,.3);color:#86efac}.message-icon{flex-shrink:0}.step-indicator{display:flex;align-items:center;justify-content:center;gap:0;margin-bottom:24px}.step{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:600;background:var(--color-bg-tertiary);border:2px solid var(--color-border);color:var(--color-text-muted);transition:all .3s ease}.step.active{background:var(--color-accent-subtle);border-color:var(--color-accent);color:var(--color-accent)}.step.completed{background:var(--color-accent);border-color:var(--color-accent);color:var(--color-accent-contrast)}.step-line{width:60px;height:2px;background:var(--color-border);transition:background .3s ease}.step-line.active{background:var(--color-accent)}.auth-form{display:flex;flex-direction:column;gap:20px}.auth-description{font-size:.9375rem;color:var(--color-text-secondary);text-align:center;margin:0;line-height:1.5}.auth-description strong{color:var(--color-accent)}.verification-icon{display:flex;justify-content:center;margin-bottom:8px;color:var(--color-accent)}.auth-field{display:flex;flex-direction:column;gap:8px}.auth-field label{font-size:.8125rem;font-weight:500;color:var(--color-text-secondary)}.auth-field label .optional{font-weight:400;color:var(--color-text-muted)}.auth-field input{width:100%;padding:14px 16px;font-size:1rem;font-family:inherit;color:var(--color-text-primary);background:var(--color-bg-secondary);border:1px solid var(--color-border);border-radius:10px;outline:none;transition:all .2s ease;box-sizing:border-box}.auth-field input::placeholder{color:var(--color-text-muted)}.auth-field input:focus{border-color:var(--color-accent);background:var(--color-bg-secondary);box-shadow:0 0 0 3px var(--color-accent-subtle)}.auth-hint{font-size:.75rem;color:var(--color-text-muted)}.field-error{font-size:.75rem;color:var(--color-error)}.code-input{font-size:1.5rem!important;letter-spacing:.5em;text-align:center;font-family:var(--font-mono, "SF Mono", Monaco, monospace)}.password-input-wrapper{position:relative;display:flex;align-items:center}.password-input-wrapper input{padding-right:48px}.password-toggle{position:absolute;right:12px;display:flex;align-items:center;justify-content:center;padding:4px;background:none;border:none;color:var(--color-text-muted);cursor:pointer;transition:color .2s ease}.password-toggle:hover{color:var(--color-text-secondary)}.password-strength{display:flex;align-items:center;gap:12px;margin-top:4px}.strength-bars{display:flex;gap:4px;flex:1}.strength-bar{height:4px;flex:1;background:#ffffff1a;border-radius:2px;transition:background-color .2s ease}.strength-bar.active{background:var(--color-accent)}.strength-label{font-size:.6875rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}.auth-button{width:100%;padding:14px 24px;font-size:1rem;font-weight:600;font-family:inherit;color:var(--color-accent-contrast);background:linear-gradient(135deg,var(--color-accent) 0%,var(--color-accent-bright) 100%);border:none;border-radius:10px;cursor:pointer;transition:all .2s ease;margin-top:8px;display:flex;align-items:center;justify-content:center;gap:10px}.auth-button svg{flex-shrink:0}.auth-button:hover:not(:disabled){background:linear-gradient(135deg,var(--color-accent) 0%,var(--color-accent-bright) 100%);transform:translateY(-1px);box-shadow:0 8px 24px #2563eb40}.auth-button:active:not(:disabled){transform:translateY(0)}.auth-button:disabled{opacity:.6;cursor:not-allowed}.auth-button--secondary{background:transparent;border:2px solid var(--color-accent);color:var(--color-accent)}.auth-button--secondary:hover:not(:disabled){background:var(--color-accent-subtle);box-shadow:0 0 20px #2563eb2e}.spinner{width:18px;height:18px;border:2px solid transparent;border-top-color:currentColor;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.auth-links{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:8px}.auth-links button{font-size:.875rem;font-family:inherit;color:var(--color-text-secondary);background:none;border:none;cursor:pointer;transition:color .2s ease;padding:4px}.auth-links button:hover:not(:disabled){color:var(--color-accent)}.auth-links button:disabled,.auth-links button.disabled{opacity:.5;cursor:not-allowed}.auth-separator{color:var(--color-text-muted)}.auth-footer{margin-top:24px;padding-top:20px;border-top:1px solid var(--color-border-subtle)}.auth-footer p{font-size:.75rem;color:var(--color-text-muted);text-align:center;margin:0}.auth-footer a{color:#2563ebb3;text-decoration:none;transition:color .2s ease}.auth-footer a:hover{color:var(--color-accent)}@media(max-width:640px){.auth-page{padding:60px 16px 16px;align-items:flex-start}.auth-glow{width:350px;height:250px}.auth-card{padding:28px 20px;border-radius:16px}.auth-logo{margin-bottom:24px;gap:10px}.auth-logo-icon{width:40px;height:40px}.auth-logo-text{font-size:1.125rem}.auth-header{margin-bottom:20px}.auth-title{font-size:1.5rem;margin-bottom:6px}.auth-subtitle{font-size:.875rem}.step-indicator{margin-bottom:20px}.step{width:26px;height:26px;font-size:.6875rem}.step-line{width:50px}.auth-form{gap:16px}.auth-field label{font-size:.75rem}.auth-field input{padding:12px 14px;font-size:.9375rem}.password-strength{gap:8px}.strength-label{font-size:.625rem}.auth-button{padding:12px 20px;font-size:.9375rem}.auth-links{margin-top:6px}.auth-links button{font-size:.8125rem}.auth-footer{margin-top:20px;padding-top:16px}.auth-footer p{font-size:.6875rem}}@media(max-width:480px){.auth-page{padding:40px 12px 12px}.auth-glow{width:280px;height:200px;bottom:-100px}.auth-card{padding:24px 18px;border-radius:14px}.auth-logo{margin-bottom:20px}.auth-logo-icon{width:36px;height:36px;border-radius:10px}.auth-logo-text{font-size:1rem}.auth-title{font-size:1.375rem}.auth-subtitle{font-size:.8125rem}.step{width:24px;height:24px}.step-line{width:40px}.auth-field input{padding:11px 12px;font-size:.875rem;border-radius:8px}.code-input{font-size:1.25rem!important;letter-spacing:.4em}.password-toggle{right:10px}.auth-button{padding:11px 18px;font-size:.875rem;border-radius:8px}.auth-message{padding:10px 14px;font-size:.8125rem;border-radius:8px}.auth-description{font-size:.875rem}.verification-icon svg{width:52px;height:52px}}@media(max-width:380px){.auth-page{padding:30px 10px 10px}.auth-card{padding:20px 16px}.auth-title{font-size:1.25rem}.auth-field input{padding:10px 11px}.auth-button{padding:10px 16px}.auth-links{gap:6px}.auth-links button{font-size:.75rem;padding:2px}}@media(prefers-reduced-motion:reduce){.auth-glow,.spinner{animation:none}}.app{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;background:radial-gradient(circle at 50% 0%,#f0fdf4,#f8fafc 40%,#f1f5f9)}.app--scrollable{min-height:100vh;min-height:100dvh;height:auto}.app--editor{height:100vh;height:100dvh;overflow:hidden}@supports selector(:has(*)){.app:has(.editor-section){height:100vh;height:100dvh;overflow:hidden}}.btn-new-project{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;background:linear-gradient(135deg,var(--color-accent) 0%,var(--color-accent-hover) 100%);color:var(--color-accent-contrast);border:none;border-radius:12px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .25s ease;box-shadow:0 4px 18px #2563eb33,0 0 0 1px #ffffff4d inset;white-space:nowrap}.btn-new-project:hover{transform:translateY(-2px);box-shadow:0 10px 28px #2563eb40,0 0 0 1px #ffffff59 inset}.btn-new-project.btn-large{padding:1rem 2rem;font-size:1rem}@media(max-width:1024px){.page-container{padding:24px 28px}}@media(max-width:768px){.page-container{padding:20px}.page-header{flex-direction:column;gap:16px}.page-header-content h1{font-size:1.5rem}}@media(max-width:640px){.page-container{padding:16px}}@media(max-width:480px){.page-header{flex-direction:row;justify-content:space-between;align-items:center}}.app-loading{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:linear-gradient(160deg,#f8faf9,#f0f5f3 40%,#e8f0ed);z-index:9999;overflow:hidden}.loading-particles{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden}.loading-particle{position:absolute;width:6px;height:6px;left:var(--x);bottom:-20px;background:var(--color-accent);border-radius:50%;animation:particle-float var(--duration) ease-in-out infinite;animation-delay:var(--delay);opacity:0}@keyframes particle-float{0%{opacity:0;transform:translateY(0) scale(0)}30%{opacity:.4;transform:scale(1)}to{opacity:0;transform:translateY(-100vh) scale(.5)}}.loading-grid{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 50% 40% at 20% 30%,rgba(16,185,129,.08) 0%,transparent 60%),radial-gradient(ellipse 40% 50% at 80% 70%,rgba(16,185,129,.06) 0%,transparent 60%),radial-gradient(ellipse 60% 30% at 60% 20%,rgba(20,184,166,.05) 0%,transparent 50%);animation:orbs-drift 8s ease-in-out infinite}@keyframes orbs-drift{0%,to{transform:translate(0) scale(1);opacity:1}50%{transform:translate(2%,-2%) scale(1.05);opacity:.7}}.loading-panel{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:28px;padding:48px 56px;background:#ffffffb3;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.8);border-radius:28px;box-shadow:0 20px 60px #10b98114,0 8px 24px #0f172a0a,inset 0 1px #ffffffe6}.loading-logo{position:relative;width:100px;height:100px;display:flex;align-items:center;justify-content:center}.loading-rings{position:absolute;top:0;right:0;bottom:0;left:0}.loading-ring{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%}.loading-ring-1{border:1px solid rgba(16,185,129,.15);animation:ring-rotate 12s linear infinite}.loading-ring-2{top:10px;right:10px;bottom:10px;left:10px;border:1px dashed rgba(16,185,129,.1);animation:ring-rotate 18s linear infinite reverse}.loading-ring-3{top:20px;right:20px;bottom:20px;left:20px;border:2px solid transparent;background:linear-gradient(#fff,#fff) padding-box,conic-gradient(from 0deg,transparent 0%,var(--color-accent) 25%,rgba(16,185,129,.3) 40%,transparent 50%) border-box;animation:ring-rotate 2s linear infinite}@keyframes ring-rotate{to{transform:rotate(360deg)}}.loading-logo-core{position:relative;width:52px;height:52px;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#10b9811a,#10b9810d);border:1px solid rgba(16,185,129,.2);border-radius:16px;z-index:2;box-shadow:0 8px 24px #10b9811f}.loading-logo-core svg{width:26px;height:26px;color:var(--color-accent)}.loading-logo-core:before{content:"";position:absolute;top:-1px;right:-1px;bottom:-1px;left:-1px;background:linear-gradient(135deg,rgba(16,185,129,.3) 0%,transparent 50%,rgba(16,185,129,.15) 100%);border-radius:16px;z-index:-1;opacity:0;animation:core-glow 2.5s ease-in-out infinite}@keyframes core-glow{0%,to{opacity:0}50%{opacity:1}}.loading-pulse{position:absolute;width:52px;height:52px;border-radius:16px;background:#10b98126;animation:pulse-soft 2.5s ease-out infinite}@keyframes pulse-soft{0%{transform:scale(1);opacity:.4}to{transform:scale(1.8);opacity:0}}.loading-brand-group{display:flex;flex-direction:column;align-items:center;gap:6px}.loading-brand{font-size:1.5rem;font-weight:600;letter-spacing:-.02em;color:var(--color-text-primary)}.loading-tagline{font-size:.6875rem;font-weight:500;text-transform:uppercase;letter-spacing:.15em;color:var(--color-accent);opacity:.8}.loading-progress{position:relative;width:180px;height:4px;background:#10b9811a;border-radius:999px;overflow:hidden}.loading-progress-bar{position:absolute;top:0;left:0;height:100%;width:35%;background:linear-gradient(90deg,var(--color-accent) 0%,rgba(16,185,129,.7) 100%);border-radius:999px;animation:progress-elegant 1.8s ease-in-out infinite}.loading-progress-bar:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.5) 50%,transparent 100%);animation:shimmer 1.5s ease-in-out infinite}@keyframes progress-elegant{0%{left:-35%}to{left:100%}}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.loading-progress-glow{display:none}.loading-indicators{display:flex;gap:6px}.loading-indicator{width:5px;height:5px;background:#10b98140;border-radius:50%;animation:indicator-wave 1.4s ease-in-out infinite}.loading-indicator:nth-child(2){animation-delay:.15s}.loading-indicator:nth-child(3){animation-delay:.3s}@keyframes indicator-wave{0%,to{background:#10b98140;transform:scale(1) translateY(0)}50%{background:var(--color-accent);transform:scale(1.2) translateY(-3px)}}.loading-spinner{position:relative;width:48px;height:48px;border:3px solid var(--color-border);border-top-color:var(--color-accent);border-radius:50%;animation:spin .8s linear infinite;z-index:1}.loading-spinner--small{width:24px;height:24px;border-width:2px}@keyframes spin{to{transform:rotate(360deg)}}.main-content{flex:1;display:flex;flex-direction:column;max-width:1600px;margin:0 auto;width:100%;min-height:0;overflow-y:auto;overflow-x:hidden;background:#f8fafc}.main-content:has(.editor-section){overflow:hidden;padding:var(--space-md) var(--space-xl)}.app--editor .header{position:static;box-shadow:none}.app--editor .header-content{display:grid;grid-template-columns:auto 1fr auto;align-items:center;height:auto;padding:12px 16px;gap:12px}.app--editor .project-name-section{justify-content:center;min-width:0}.app--editor .header-actions{justify-content:flex-end;flex-wrap:wrap}.upload-section{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;padding:0;width:100vw;height:100vh;background:var(--color-accent-contrast)}.editor-section{flex:1;display:flex;flex-direction:column;min-height:0;overflow:hidden;padding:var(--space-md)}.editor-layout{display:grid;grid-template-columns:220px 1fr;gap:var(--space-md);flex:1;min-height:0;overflow:hidden}.editor-left-panel,.canvas-area{display:flex;flex-direction:column;gap:var(--space-md);min-height:0;overflow:hidden}.footer{padding:var(--space-sm) var(--space-xl);text-align:center;border-top:1px solid var(--color-border-subtle);flex-shrink:0}.footer p{font-size:.75rem;color:var(--color-text-muted);font-family:var(--font-mono);letter-spacing:.02em}.app:has(.upload-section) .footer{display:none}@media(max-width:1280px){.main-content{max-width:100%}.editor-layout{grid-template-columns:200px 1fr}}@media(max-width:1024px){.main-content:has(.editor-section){overflow-y:auto;padding:12px 16px 16px}.editor-section{padding:12px;overflow-y:auto}.editor-layout{display:flex;flex-direction:column;gap:12px;overflow:visible;min-height:auto}.editor-left-panel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;order:2;overflow:visible;min-height:auto}.canvas-area{order:1;display:flex;flex-direction:column;gap:10px;min-height:auto;overflow:visible}}@media(max-width:768px){.main-content:has(.editor-section){padding:10px 12px 16px}.editor-left-panel{grid-template-columns:1fr}.app--editor .header-content{grid-template-columns:1fr;justify-items:center}.app--editor .header-actions{justify-content:center}.editor-section{padding:10px}.editor-layout{gap:10px}.new-project-container{margin:2rem auto;padding:0 1rem;gap:2rem}.new-project-header h1{font-size:1.75rem}.new-project-header p{font-size:1rem}}@media(max-width:640px){.main-content:has(.editor-section){padding:8px 10px 16px}.editor-section{padding:8px}.editor-layout{gap:8px}.editor-left-panel{grid-template-columns:1fr;gap:8px}.canvas-area{gap:8px}.upload-section{padding:var(--space-md) 0}.new-project-container{margin:1rem auto;gap:1.5rem}.new-project-header h1{font-size:1.5rem}.simple-uploader-wrapper .uploader-wrapper{min-height:240px;padding:2rem 1.5rem;border-radius:16px}}@media(max-width:480px){.main-content:has(.editor-section){padding:10px}.editor-section{padding:10px}.editor-layout,.editor-left-panel,.canvas-area{gap:12px}}:root{--color-bg-primary: #f7f8fa;--color-bg-secondary: #ffffff;--color-bg-tertiary: #eef1f5;--color-bg-elevated: #ffffff;--color-bg-hover: #e7ebf2;--color-bg-card: #ffffff;--color-border: #e0e6ee;--color-border-subtle: #edf1f6;--color-border-accent: #c6d0dd;--color-border-glow: rgba(16, 185, 129, .16);--color-text-primary: #0f172a;--color-text-secondary: #475569;--color-text-tertiary: #64748b;--color-text-muted: #94a3b8;--color-accent: #10b981;--color-accent-hover: #0ea371;--color-accent-bright: #22c994;--color-accent-muted: rgba(16, 185, 129, .16);--color-accent-subtle: rgba(16, 185, 129, .08);--color-accent-glow: rgba(16, 185, 129, .22);--color-accent-contrast: #ffffff;--color-secondary: #22d3ee;--color-secondary-muted: rgba(34, 211, 238, .18);--gradient-warm-start: rgba(16, 185, 129, .1);--gradient-warm-mid: rgba(16, 185, 129, .04);--gradient-warm-end: transparent;--color-success: #10b981;--color-success-muted: rgba(16, 185, 129, .12);--color-error: #ef4444;--color-error-muted: rgba(239, 68, 68, .12);--font-display: "Manrope", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono: "JetBrains Mono", "SF Mono", Consolas, monospace;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 32px;--space-2xl: 48px;--space-3xl: 64px;--space-4xl: 96px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-xl: 24px;--radius-2xl: 32px;--shadow-sm: 0 1px 2px rgba(15, 23, 42, .08);--shadow-md: 0 6px 20px rgba(15, 23, 42, .12);--shadow-lg: 0 16px 40px rgba(15, 23, 42, .16);--shadow-xl: 0 24px 64px rgba(15, 23, 42, .18);--shadow-glow: 0 0 48px rgba(16, 185, 129, .14);--shadow-glow-strong: 0 0 80px rgba(16, 185, 129, .2);--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .25s cubic-bezier(.4, 0, .2, 1);--transition-slow: .4s cubic-bezier(.4, 0, .2, 1);--transition-spring: .5s cubic-bezier(.34, 1.56, .64, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;scroll-behavior:smooth;background:#fff}body{font-family:var(--font-sans);background:#fff;color:var(--color-text-primary);line-height:1.6;min-height:100vh;min-height:100dvh;overflow-x:hidden;overscroll-behavior:none}@media(max-width:640px){html{font-size:15px}}@media(max-width:380px){html{font-size:14px}}body:before{display:none}body:after{display:none}#root{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}header.header,header.header *,header.header .header-content,header.header .header-actions,header.header .header-actions *{overflow:visible!important}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--color-bg-secondary)}::-webkit-scrollbar-thumb{background:var(--color-border-accent);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--color-text-muted)}::selection{background:var(--color-accent-muted);color:var(--color-accent)}:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.font-display{font-family:var(--font-display)}.text-gradient{background:linear-gradient(135deg,var(--color-accent) 0%,var(--color-accent-bright) 50%,var(--color-accent) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);position:relative;overflow:hidden}.card:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent 0%,rgba(37,99,235,.25) 50%,transparent 100%);opacity:0;transition:opacity var(--transition-base)}.card:hover:before{opacity:1}.glow{transition:box-shadow var(--transition-base)}.glow:hover{box-shadow:var(--shadow-glow)}button{font-family:inherit;cursor:pointer}.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;background:linear-gradient(135deg,var(--color-accent) 0%,var(--color-accent-bright) 100%);border:none;border-radius:var(--radius-md);color:var(--color-accent-contrast);font-size:.9375rem;font-weight:600;letter-spacing:.01em;transition:all var(--transition-fast)}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 8px 24px #2563eb40}.btn-primary:active{transform:translateY(0)}.btn-secondary{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;background:transparent;border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-primary);font-size:.9375rem;font-weight:500;transition:all var(--transition-fast)}.btn-secondary:hover{background:var(--color-bg-hover);border-color:var(--color-border-accent)}input,textarea,select{font-family:inherit;font-size:inherit}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.skeleton-shimmer{background:linear-gradient(90deg,var(--color-bg-tertiary) 0%,var(--color-bg-hover) 50%,var(--color-bg-tertiary) 100%);background-size:200% 100%;animation:shimmer 1.5s ease-in-out infinite}