@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Outfit:wght@700;800;900&display=swap";:root{--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-display:"Outfit", var(--font-sans);--bg-app:#fff;--bg-app-secondary:#f8fafc;--bg-card:#fff;--bg-card-solid:#fff;--bg-card-hover:#f1f5f9;--bg-input:#fff;--border-card:#e2e8f0;--border-input:#cbd5e1;--border-focus:#ff574480;--text-primary:#0f172a;--text-secondary:#475569;--text-muted:#94a3b8;--accent-primary:#ff5744;--accent-primary-glow:#ff574426;--accent-secondary:#e5493b;--accent-success:#10b981;--accent-warning:#f59e0b;--header-bg:#1e293b;--header-text:#f1f5f9;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #00000012, 0 2px 4px -2px #0000000d;--shadow-lg:0 10px 25px -5px #00000014, 0 8px 10px -6px #0000000a}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--bg-app);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;line-height:1.6;overflow-x:hidden}.app-header{background-color:var(--header-bg);z-index:100;justify-content:space-between;align-items:center;padding:.75rem 2rem;display:flex;position:sticky;top:0}.logo-wrapper{align-items:center;gap:.5rem;text-decoration:none;display:flex}.logo-icon{align-items:center;font-size:1.4rem;display:flex}.logo-text{font-family:var(--font-display);color:var(--header-text);letter-spacing:-.5px;font-size:1.35rem;font-weight:900}.logo-text span{color:var(--accent-primary)}.app-container{flex-direction:column;min-height:100vh;display:flex}.main-workspace{flex-grow:1;width:100%}.btn{cursor:pointer;border:1px solid #0000;border-radius:.5rem;justify-content:center;align-items:center;gap:.5rem;padding:.7rem 1.3rem;font-family:inherit;font-size:.9rem;font-weight:600;transition:all .2s cubic-bezier(.4,0,.2,1);display:inline-flex}.btn-primary{background-color:var(--accent-primary);color:#fff;box-shadow:0 1px 3px #ff57444d}.btn-primary:hover:not(:disabled){background-color:var(--accent-secondary);transform:translateY(-1px);box-shadow:0 4px 12px #ff574440}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.btn-secondary{border-color:var(--border-card);color:var(--text-primary);background-color:#fff}.btn-secondary:hover:not(:disabled){background-color:var(--bg-card-hover);border-color:#94a3b8}.btn-secondary:disabled{opacity:.5;cursor:not-allowed}.btn-sm{border-radius:.375rem;padding:.4rem .8rem;font-size:.775rem}.form-group{flex-direction:column;gap:.4rem;margin-bottom:.85rem;display:flex}.form-label{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px;font-size:.75rem;font-weight:600}.form-input{background-color:var(--bg-input);border:1px solid var(--border-input);color:var(--text-primary);font-family:var(--font-sans);border-radius:.5rem;width:100%;padding:.65rem .85rem;font-size:.9rem;transition:all .2s}.form-input:focus{border-color:var(--accent-primary);box-shadow:0 0 0 3px var(--accent-primary-glow);outline:none}.form-input::placeholder{color:var(--text-muted)}.input-with-icon{align-items:center;display:flex;position:relative}.input-with-icon .input-icon{color:var(--text-muted);pointer-events:none;position:absolute;left:12px}.input-with-icon .form-input{padding-left:36px}.code-box{color:#38bdf8;background-color:#1e293b;border:1px solid #334155;border-radius:8px;margin-top:.5rem;padding:1rem;font-family:SF Mono,Fira Code,monospace;font-size:.8rem;position:relative;overflow:hidden}.code-box pre{white-space:pre-wrap;word-break:break-all;margin:0}.chat-input{border:1px solid var(--border-input);color:var(--text-primary);background-color:#fff;border-radius:6px;outline:none;flex-grow:1;padding:8px 12px;font-family:inherit;font-size:.85rem;transition:border-color .2s}.chat-input:focus{border-color:var(--accent-primary)}.animate-spin{animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (width<=767px){.app-header{padding:.75rem 1rem}h1{font-size:1.85rem!important}.split-pane-layout{flex-direction:column!important;height:auto!important;overflow-y:visible!important}.left-pane-dashboard{border-bottom:1px solid var(--border-card);border-right:none!important;width:100%!important;height:auto!important;padding:1.5rem 1rem!important}.right-pane-preview{width:100%!important;height:auto!important;padding:2rem 1rem!important}}