.header{position:fixed;top:0;left:0;width:100%;height:var(--header-height);padding-left:10px;padding-right:10px;display:flex;align-items:center;background:linear-gradient(90deg,#0a8f4d,#10b981);z-index:1000}.header-inner{display:flex;align-items:center;width:100%}.left-group{display:flex;align-items:center;gap:24px;padding:0}.logo{display:flex;align-items:center;gap:6px;padding:0;line-height:1;align-self:center;text-decoration:none;color:#fff;font-weight:700;font-size:18px;cursor:pointer;position:relative}.logo:after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:2px;background:#ffffffe6;transition:width .2s ease}.logo:hover:after{width:100%}.logo:hover{color:#fff}.logo-icon{padding:0;background:none;border-radius:0;font-size:15px}.nav{display:flex;gap:18px}.nav a{color:#eafff5;text-decoration:none;font-weight:500;font-size:16px;position:relative}.nav a:after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:2px;background:#ffffffe6;transition:width .2s ease}.nav a:hover:after{width:100%}.nav a:hover{color:#fff}.login-btn{margin-left:auto;background:linear-gradient(180deg,#ff9f1c,#ff7a00);border:none;color:#fff;border-radius:999px;font-size:14px;font-weight:600;cursor:pointer;padding:6px 14px;transition:transform .15s ease,box-shadow .15s ease}.login-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #00000040}.profile-icon{width:36px;height:36px;border-radius:50%;background:#6d28d9;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:18px;color:#fff;transition:.2s}.profile-icon:hover{transform:scale(1.05)}.logo-img{height:60px;width:auto;display:block}.hamburger{display:none;flex-direction:column;gap:5px;margin-left:auto;cursor:pointer}.hamburger span{width:25px;height:3px;background:#fff;border-radius:2px;transition:.3s}.mobile-menu{position:absolute;top:var(--header-height);left:0;width:100%;background:#0a8f4d;display:flex;flex-direction:column;align-items:center;padding:20px 0;gap:18px;animation:slideDown .2s ease}.mobile-menu a{color:#fff;text-decoration:none;font-size:18px;font-weight:600}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media(max-width:850px){.nav,.desktop-btn{display:none}.hamburger{display:flex}}html.dark .header{background:#121826;border-bottom:1px solid #1f2937}html.dark .nav a{color:#9ca3af}html.dark .nav a:hover{color:#a78bfa}html.dark .login-btn{background:linear-gradient(135deg,#10b981,#7c3aed)}.home-empty{min-height:calc(100vh - var(--header-height));display:flex;flex-direction:column;justify-content:center;align-items:center;background:#ecfdf5;text-align:center;color:#064e3b}.home-empty button{margin-top:24px;padding:14px 28px;border-radius:999px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;font-weight:700}.workspace-layout{display:grid;grid-template-columns:280px 1fr;min-height:calc(100vh - var(--header-height));background:#f0fdf4;color:#064e3b}.sidebar{padding:24px;background:#fff;border-right:1px solid #d1fae5}.new-project{width:100%;margin:12px 0;padding:10px;border-radius:10px;background:#10b981;color:#fff;border:none;font-weight:600}.project{padding:8px 12px;border-radius:8px;margin-bottom:6px;cursor:pointer}.project.active{background:#ecfdf5;font-weight:600}.steps-list{margin-top:24px}.step{padding:8px 10px;border-radius:8px;cursor:pointer;font-size:.9rem}.step.active{background:#d1fae5;font-weight:600}.workspace{padding:32px}.workspace-header{display:flex;justify-content:space-between;align-items:center}.workspace-header span{color:#10b981}.storage-btn{padding:8px 16px;border-radius:999px;border:1px solid #10b981;background:#fff;color:#059669;font-weight:600}.prompt-header{margin-top:32px;padding:14px;border-radius:12px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;font-weight:600}.prompt-input{margin-top:16px;width:100%;min-height:70px;max-height:140px;padding:14px 16px;border-radius:14px;border:2px solid #7c3aed;outline:none;font-size:.95rem;resize:none}.prompt-input:focus{box-shadow:0 0 0 2px #7c3aed40}.workspace-actions{margin-top:24px;display:flex;gap:16px}.save{padding:12px 24px;border-radius:999px;background:#10b981;color:#fff;border:none;font-weight:700}.next{padding:12px 24px;border-radius:999px;background:#2563eb;color:#fff;border:none;font-weight:700}@media(max-width:900px){.workspace-layout{grid-template-columns:1fr}.sidebar{display:none}}.home-page,.workspace-layout{background:var(--bg-main);color:var(--text-main)}.sidebar,.workspace,.prompt-panel{background:var(--bg-card);border:1px solid var(--border-soft)}.step.active{background:#d1fae5;color:#047857}.progress-section{margin-bottom:24px}.progress-label{font-size:.8rem;opacity:.7;margin-bottom:6px}.progress-text{font-weight:600;margin-bottom:8px}.progress-bar{height:6px;background:#ffffff1a;border-radius:6px;overflow:hidden}.progress-fill{height:100%;background:#7c3aed;transition:width .3s}.restart{padding:12px 24px;border-radius:999px;background:transparent;border:1px solid #ef4444;color:#ef4444;font-weight:600;cursor:pointer}.chat-container{margin-top:20px;display:flex;flex-direction:column;gap:18px}.chatkit-frame{margin-top:20px;width:100%;height:560px;border-radius:14px;overflow:hidden;border:1px solid #d1fae5;background:#fff}.chat-message{max-width:70%;padding:14px 18px;border-radius:14px;line-height:1.6}.chat-message.user{align-self:flex-end;background:#1f2937;color:#fff}.chat-message.ai{align-self:flex-start;background:transparent;color:#e5e7eb}.chat-message.thinking{opacity:.6;font-style:italic}.confirm-step{background:linear-gradient(135deg,#7b5cff,#9f6bff);color:#fff;border:none;padding:10px 22px;border-radius:20px;font-weight:600;cursor:pointer;margin-right:12px}.confirm-step:hover{transform:translateY(-1px)}html.dark .home-page,html.dark .workspace-layout{background:#0b0f14;color:#e5e7eb}html.dark .sidebar{background:#121826;border-right:1px solid #1f2937}html.dark .workspace,html.dark .prompt-panel{background:#121826;border:1px solid #1f2937}html.dark .step{color:#9ca3af}html.dark .workspace-header span{color:#a78bfa}html.dark .new-project{background:#7c3aed}html.dark .storage-btn{border:1px solid #7c3aed;color:#a78bfa;background:transparent}html.dark .prompt-header{background:linear-gradient(135deg,#7c3aed,#4c1d95)}html.dark .prompt-input{border:2px solid #7c3aed;background:#1a2233;color:#e5e7eb}html.dark .save{background:linear-gradient(135deg,#7c3aed,#9333ea)}html.dark .step.active{background:#7c3aed33;color:#c4b5fd}html.dark .home-empty{background:#0b0f14;color:#e5e7eb}html.dark .home-empty button{background:linear-gradient(135deg,#7c3aed,#9333ea)}html.dark .home-empty button html.dark .restart{border:1px solid #f87171;color:#f87171}.step-form-card{margin-top:40px;background:var(--bg-card);border:1px solid var(--border-soft);border-radius:16px;padding:28px 32px;max-width:900px}.step-form-card h3{font-size:1.2rem;font-weight:700;margin-bottom:24px;color:var(--text-main)}.step-form-card>div{display:flex;flex-direction:column;margin-bottom:18px}.step-form-card label{font-size:.85rem;font-weight:600;margin-bottom:6px;opacity:.8}.step-form-card input{height:42px;padding:10px 12px;border-radius:10px;border:1px solid var(--border-soft);background:var(--bg-main);color:var(--text-main);font-size:.9rem;outline:none;transition:border .15s,box-shadow .15s}.step-form-card textarea{min-height:90px;padding:12px;border-radius:10px;border:1px solid var(--border-soft);background:var(--bg-main);color:var(--text-main);font-size:.9rem;resize:vertical;outline:none;transition:border .15s,box-shadow .15s}.step-form-card input:focus,.step-form-card textarea:focus{border:1px solid #7c3aed;box-shadow:0 0 0 2px #7c3aed26}.build-artifact{margin-top:12px;align-self:flex-start;padding:10px 20px;border-radius:999px;border:none;font-weight:600;cursor:pointer;background:linear-gradient(135deg,#7b5cff,#9f6bff);color:#fff;transition:transform .15s,box-shadow .15s}.build-artifact:hover{transform:translateY(-1px);box-shadow:0 6px 14px #7c3aed59}.artifact-preview-card{margin-top:28px;background:var(--bg-card);border:1px solid var(--border-soft);border-radius:16px;padding:24px;max-width:900px}.artifact-preview-card h3{margin-bottom:14px}.artifact-preview-card pre{white-space:pre-wrap;line-height:1.6;font-size:.9rem;background:var(--bg-main);padding:16px;border-radius:12px;border:1px solid var(--border-soft)}@media(max-width:700px){.step-form-card{padding:22px}.step-form-card input,.step-form-card textarea{font-size:.85rem}}.step.locked{opacity:.35;cursor:not-allowed;pointer-events:none}.results-container{display:flex;flex-direction:column;gap:28px;max-width:900px}.result-card{background:#0b1730;border-radius:14px;padding:28px;border:1px solid rgba(255,255,255,.05);box-shadow:0 10px 25px #00000073;transition:transform .15s ease}.result-card:hover{transform:translateY(-2px)}.result-header{display:flex;align-items:center;gap:12px;margin-bottom:16px}.result-step{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#7b86ff;font-weight:600}.result-title{font-size:20px;font-weight:700;color:#fff}.result-content pre{white-space:pre-wrap;font-family:system-ui;font-size:15px;line-height:1.6;color:#d6dcff}.export-btn{margin-top:40px;padding:14px 28px;border-radius:8px;border:none;background:linear-gradient(135deg,#6c7cff,#a78bfa);color:#fff;font-weight:600;cursor:pointer;box-shadow:0 6px 20px #00000059;transition:transform .15s ease}.export-btn:hover{transform:translateY(-2px)}.home-brand{display:flex;flex-direction:column;align-items:center;gap:12px;margin-bottom:24px}.home-logo{width:160px;height:auto}.home-beta{font-size:28px;font-weight:600;letter-spacing:1px;color:#a78bfa}@media(max-width:600px){.home-logo{display:none}}.tutorial-page{min-height:calc(100vh - var(--header-height));padding:80px 24px;background:linear-gradient(135deg,#ecfdf5,#d1fae5);display:flex;flex-direction:column;align-items:center}.tutorial-container{max-width:1000px;width:100%;display:flex;flex-direction:column;gap:64px;text-align:center}.tutorial-hero h1{font-size:42px;font-weight:800;color:#065f46}.subtitle{font-size:18px;margin-top:12px;color:#047857}.desc{margin-top:10px;color:#065f46;opacity:.85}.hero-buttons{display:flex;gap:16px;justify-content:center;margin-top:24px}.primary-btn{background:linear-gradient(135deg,#10b981,#059669);border:none;padding:12px 22px;border-radius:10px;color:#fff;font-weight:600;cursor:pointer;transition:.2s;text-decoration:none}.primary-btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px #10b98140}.tutorial-help h2{color:#065f46}.tutorial-help ul{list-style:none;padding:0;margin-top:20px;color:#047857}.tutorial-help li{margin:8px 0}.tutorial-output h2{color:#065f46}.output-sub{color:#047857}.output-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;margin-top:24px}.output-card{padding:18px;border-radius:14px;background:#fff;border:1px solid #a7f3d0;color:#065f46;transition:.2s}.output-card:hover{transform:translateY(-4px);box-shadow:0 10px 20px #10b98126}.tutorial-bottom{display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap}.bottom-card{padding:22px;border-radius:14px;max-width:360px;background:#fff;border:1px solid #a7f3d0;color:#065f46}.plus{font-size:28px;opacity:.5;color:#059669;display:flex;align-items:center;justify-content:center}@media(max-width:720px){.tutorial-bottom{flex-direction:column;gap:24px}.bottom-card{max-width:320px}}html.dark .tutorial-page{background:#0b0f14;color:#e5e7eb}html.dark .output-card,html.dark .bottom-card{background:#121826;border:1px solid #1f2937;color:#a78bfa}html.dark h1,html.dark h2{color:#a78bfa}html.dark .subtitle,html.dark .desc,html.dark li,html.dark .output-sub{color:#9ca3af}html.dark .primary-btn{background:linear-gradient(135deg,#7c3aed,#9333ea)}.pricing-page{min-height:calc(100vh - var(--header-height));padding:80px 24px;background:linear-gradient(135deg,#ecfdf5,#d1fae5);display:flex;flex-direction:column;align-items:center}.pricing-header{text-align:center;margin-bottom:60px}.pricing-header h1{font-size:42px;font-weight:800;color:#064e3b}.pricing-header p{margin-top:8px;font-size:18px;color:#065f46}.pricing-grid{display:grid;grid-template-columns:repeat(3,minmax(280px,1fr));gap:32px;width:100%;max-width:1200px}.pricing-card{background:#fff;border-radius:18px;padding:36px 32px;box-shadow:0 20px 40px #00000014;position:relative;display:flex;flex-direction:column;align-items:center;text-align:center}.pricing-card h2{font-size:26px;font-weight:700;color:#064e3b}.tier-label{margin-top:4px;font-size:14px;font-weight:600;color:#10b981}.price{margin:28px 0 12px}.coming-soon{font-size:22px;font-weight:700;color:#059669}.tier-use{font-size:15px;color:#047857;margin-bottom:24px;max-width:280px}.tier-features{list-style:none;padding:0;margin:0 0 32px;width:100%}.tier-features li{font-size:15px;color:#065f46;padding:10px 0;border-bottom:1px solid #ecfdf5}.tier-btn{margin-top:auto;width:100%;padding:14px 0;border-radius:999px;border:none;background:linear-gradient(180deg,#10b981,#059669);color:#fff;font-size:15px;font-weight:600;cursor:default}.tier-btn.disabled{background:#e5e7eb;color:#6b7280}.pricing-card.featured{transform:translateY(-12px);border:2px solid #10b981}.badge{position:absolute;top:-14px;background:#10b981;color:#fff;padding:6px 14px;font-size:12px;font-weight:600;border-radius:999px}@media(max-width:900px){.pricing-grid{grid-template-columns:1fr}.pricing-card.featured{transform:none}}html.dark .pricing-page{background:#0b0f14;color:#e5e7eb}html.dark .pricing-card{background:#121826;border:1px solid #1f2937}html.dark .pricing-card.featured{border-color:#7c3aed;box-shadow:0 0 0 1px #7c3aed66,0 0 20px #7c3aed40}html.dark .pricing-title{color:#e5e7eb}html.dark .pricing-price{color:#9ca3af}html.dark .pricing-header h1{color:#a78bfa}html.dark .pricing-header p{color:#9ca3af}html.dark .tier-use{color:#9ca3af}html.dark .tier-btn{background:linear-gradient(135deg,#7c3aed,#9333ea)}html.dark .badge{background:#7c3aed}html.dark .pricing-card.featured{border:2px solid #7c3aed;box-shadow:0 0 20px #7c3aed59}html.dark .pricing-card h2{color:#e5e7eb}html.dark .tier-label{color:#a78bfa}html.dark .tier-features li,html.dark .tier-use{color:#9ca3af}html.dark .coming-soon{color:#c4b5fd}.auth-page{position:fixed;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;background:#e9fdf1;padding:24px 16px;min-height:calc(100vh - var(--header-height))}.auth-container{width:980px;max-width:96%;border-radius:16px;padding:40px 50px;display:flex;flex-direction:column;background:linear-gradient(135deg,#0b6b43,#0f8f5f);box-shadow:0 10px 40px #0000001a}.auth-header{display:flex;flex-direction:column;gap:8px;margin-bottom:24px}.auth-title{font-size:42px;font-weight:700;color:#064e3b}.auth-underline{width:60px;height:6px;background:#34d399;border-radius:8px}.auth-body{display:flex;justify-content:space-between;gap:40px}.auth-fields{flex:1;display:flex;flex-direction:column;gap:18px}.auth-input{display:flex;align-items:center;height:56px;background:#eaeaea;border-radius:8px}.auth-input img{margin:0 16px}.auth-input input{width:100%;border:none;background:transparent;outline:none;font-size:16px;color:#000}.auth-sidebrand{width:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}.auth-sidebrand-logo{width:120px;height:auto}.auth-sidebrand-text{font-size:26px;font-weight:800;letter-spacing:1px;color:#34d399}.auth-submit-row{display:flex;justify-content:center;margin-top:28px}.auth-buttons{display:flex;gap:20px}.auth-btn{width:180px;height:48px;display:flex;align-items:center;justify-content:center;border-radius:50px;font-weight:700;color:#fff;background:linear-gradient(180deg,#10b981,#059669);cursor:pointer}.auth-btn.gray{background:#eaeaea;color:#676767}.auth-forgot{text-align:center;margin-top:16px;color:#34d399}.auth-forgot span{cursor:pointer}@media(max-width:900px){.auth-body{flex-direction:column;align-items:center}.auth-sidebrand{display:none}.auth-fields{width:100%}}html.dark .auth-page{background:#0b0f14}html.dark .auth-container{background:#121826;border:1px solid #1f2937;color:#e5e7eb}html.dark .auth-title{color:#a78bfa}html.dark .auth-underline{background:#7c3aed}html.dark .auth-input{background:#1a2233;border:1px solid #1f2937}html.dark .auth-input input{color:#e5e7eb}html.dark .auth-sidebrand-text{color:#a78bfa}html.dark .auth-btn{background:linear-gradient(135deg,#7c3aed,#9333ea)}html.dark .auth-input:focus-within{box-shadow:0 0 0 2px #7c3aed59;border-color:#7c3aed}@media(max-width:420px){.auth-buttons{width:100%;gap:10px}.auth-btn{width:100%;max-width:140px;height:42px;font-size:14px}}.account-page{min-height:calc(100vh - 5%);padding:clamp(24px,5vw,56px);background:linear-gradient(180deg,#eafff5,#f6fffb)}.account-header{margin-bottom:36px}.account-header h1{font-size:clamp(28px,4vw,40px);font-weight:800;color:#065f46}.account-header p{margin-top:6px;font-size:16px;color:#047857}.account-sections{display:grid;grid-template-columns:1fr;gap:24px;max-width:900px}.account-card{background:#fff;border-radius:16px;padding:24px 28px;box-shadow:0 10px 30px #00000014;display:flex;flex-direction:column;gap:14px}.account-card h2{font-size:20px;font-weight:700;color:#064e3b;margin-bottom:6px}.account-row{display:flex;justify-content:space-between;align-items:center;font-size:15px;color:#065f46}.muted{color:#9ca3af;font-style:italic}.pill{background:#d1fae5;color:#047857;padding:6px 14px;border-radius:999px;font-size:14px;font-weight:600}.account-actions{display:flex;gap:12px;flex-wrap:wrap;margin:6px 0}.ghost-btn{background:transparent;border:2px solid #10b981;color:#047857;padding:10px 16px;border-radius:999px;font-weight:600;cursor:not-allowed;opacity:.6}.danger-btn{background:#fee2e2;border:none;color:#b91c1c;padding:10px 16px;border-radius:999px;font-weight:600;cursor:not-allowed;opacity:.6}@media(max-width:640px){.account-card{padding:20px}.account-row{flex-direction:column;align-items:flex-start;gap:4px}}html.dark .account-page{background:#0b0f14;color:#e5e7eb}html.dark .account-container{background:#121826;border:1px solid #1f2937}html.dark .account-section{background:#1a2233;border:1px solid #1f2937}html.dark .account-section h2{color:#a78bfa}html.dark .account-placeholder{background:#7c3aed26;color:#a78bfa}html.dark .account-card{background:#121826;border:1px solid #1f2937;box-shadow:none}html.dark .account-card h2{color:#a78bfa}html.dark .account-row{color:#9ca3af}html.dark .pill{background:#7c3aed33;color:#a78bfa}html.dark .ghost-btn{border:2px solid #7c3aed;color:#a78bfa}html.dark .danger-btn{background:#ef444426;color:#f87171}html.dark button{background:#1f2937;color:#e5e7eb}#root{display:flex;flex-direction:column;width:100%;align-items:stretch;--header-height: 4rem}.logo{will-change:filter;transition:filter .3s}body{margin:0;padding-top:48px;display:flex}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(prefers-reduced-motion:no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}.app{display:flex;flex-direction:column;min-height:100vh;padding-top:var(--header-height)}.content{flex:1;display:flex;flex-direction:column}:root{--bg-main: #eafff5;--bg-card: #ffffff;--bg-soft: #f0fdf4;--text-main: #064e3b;--text-secondary: #166534;--text-muted: #6b7280;--border-soft: #d1fae5;--accent-green: #10b981;--accent-green-soft: #34d399;--accent-purple: #7c3aed;--accent-purple-soft: #a78bfa;--hover-glow: 0 0 0 1px rgba(124, 58, 237, .25), 0 0 12px rgba(16, 185, 129, .25)}html.dark{--bg-main: #0b0f14;--bg-card: #121826;--bg-soft: #1a2233;--text-main: #e5e7eb;--text-secondary: #9ca3af;--text-muted: #6b7280;--border-soft: #1f2937;--accent-green: #10b981;--accent-green-soft: #34d399;--accent-purple: #7c3aed;--accent-purple-soft: #a78bfa;--hover-glow: 0 0 0 1px rgba(124, 58, 237, .4), 0 0 20px rgba(16, 185, 129, .25)}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}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}@media(prefers-color-scheme:light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}*,*:before,*:after{box-sizing:border-box}html,body{margin:0;padding:0;width:100%}body{overflow-x:hidden;font-family:system-ui,-apple-system,BlinkMacSystemFont,sans-serif}#root{width:100%;min-height:100vh}