@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap";@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500&display=swap";.login-container{width:100%;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;background:radial-gradient(circle at top,rgba(33,150,243,.18),transparent 35%),radial-gradient(circle at bottom right,rgba(124,58,237,.22),transparent 28%),linear-gradient(145deg,#13172a,#1e2235 45%,#111827);overflow:hidden}.login-card{--pointer-x: 50%;--pointer-y: 50%;position:relative;overflow:hidden;background:#fffffff5;border-radius:20px;padding:48px 40px;width:100%;max-width:380px;border:1px solid rgba(255,255,255,.45);box-shadow:0 25px 50px #00000040,0 0 0 1px #ffffff2e inset;text-align:center;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);animation:login-card-enter .8s cubic-bezier(.22,1,.36,1)}.login-card:before{content:"";position:absolute;inset:-30%;background:radial-gradient(circle 140px at var(--pointer-x) var(--pointer-y),rgba(255,255,255,.9),transparent 55%);opacity:0;transition:opacity .25s ease;pointer-events:none}.login-card:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(124,58,237,.12),transparent 30%,rgba(6,182,212,.08));pointer-events:none}.login-card:hover:before{opacity:.75}.login-logo{position:relative;z-index:1;width:100px;height:auto;margin-bottom:24px}.login-title{position:relative;z-index:1;font-size:20px;font-weight:600;color:#1a1a2e;margin:0 0 32px}.login-form{position:relative;z-index:1;display:flex;flex-direction:column;gap:16px}.login-error{animation:login-fade-up .25s ease-out;padding:12px 16px;background:#fef2f2;border:1px solid #fecaca;border-radius:8px;color:#ef4444;font-size:14px}.login-button{position:relative;overflow:hidden;width:100%;padding:14px;background:linear-gradient(135deg,#7c3aed,#06b6d4);color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s;margin-top:8px}.login-button:before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent 20%,rgba(255,255,255,.32) 50%,transparent 80%);transform:translate(-120%);transition:transform .5s ease}.login-button:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #7c3aed66}.login-button:hover:not(:disabled):before{transform:translate(120%)}.login-button:disabled{background:linear-gradient(135deg,#a78bfa,#67e8f9);cursor:not-allowed;transform:none}.mfa-form{display:flex;flex-direction:column;align-items:center;gap:12px;animation:login-fade-up .35s ease-out}.mfa-instructions{font-size:14px;color:#666;text-align:center;margin:0}.mfa-code-input{text-align:center;font-size:24px!important;letter-spacing:8px;font-weight:600}.mfa-cancel-link{background:none;border:none;color:#666;font-size:13px;cursor:pointer;padding:4px 8px;text-decoration:underline}.mfa-cancel-link:hover{color:#333}.mfa-cancel-link:disabled{opacity:.5;cursor:not-allowed}@keyframes login-card-enter{0%{opacity:0;transform:translateY(24px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes login-fade-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media(max-width:480px){.login-container{padding:16px}.login-card{padding:40px 24px;border-radius:16px}.login-logo{width:80px}}.notification-container{position:fixed;bottom:24px;right:24px;z-index:9999;display:flex;flex-direction:column-reverse;gap:12px;max-width:400px;max-height:calc(100vh - 100px);overflow:hidden;pointer-events:none}.notification-toast{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;background:#fff;border-radius:12px;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f,0 0 0 1px #0000000d;pointer-events:auto;position:relative;overflow:hidden;opacity:0;transform:translate(100%) scale(.95);transition:all .35s cubic-bezier(.4,0,.2,1)}.notification-toast.visible{opacity:1;transform:translate(0) scale(1)}.notification-toast.exiting{opacity:0;transform:translate(100%) scale(.95)}.notification-toast:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;border-radius:12px 0 0 12px}.notification-toast.success:before{background:#10b981}.notification-toast.error:before{background:#ef4444}.notification-toast.warning:before{background:#f59e0b}.notification-toast.info:before{background:#4a90e2}.notification-toast.loading:before{background:linear-gradient(135deg,#667eea,#764ba2)}.notification-icon-wrapper{flex-shrink:0;width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center}.notification-toast.success .notification-icon-wrapper{background:#10b9811a;color:#10b981}.notification-toast.error .notification-icon-wrapper{background:#ef44441a;color:#ef4444}.notification-toast.warning .notification-icon-wrapper{background:#f59e0b1a;color:#f59e0b}.notification-toast.info .notification-icon-wrapper{background:#4a90e21a;color:#4a90e2}.notification-toast.loading .notification-icon-wrapper{background:linear-gradient(135deg,#667eea1a,#764ba21a);color:#667eea}.notification-spinner{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.notification-body{flex:1;min-width:0}.notification-header{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.notification-title{font-size:14px;font-weight:600;color:#1a1a2e;line-height:1.4;word-break:break-word}.notification-message{margin:4px 0 0;font-size:13px;color:#64748b;line-height:1.5;word-break:break-word}.notification-dismiss{flex-shrink:0;width:24px;height:24px;border:none;background:transparent;border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#94a3b8;transition:all .2s ease;margin:-4px -4px 0 0}.notification-dismiss:hover{background:#0000000d;color:#475569}.notification-dismiss:active{transform:scale(.95)}.notification-actions{display:flex;gap:8px;margin-top:12px}.notification-action{padding:6px 12px;border-radius:6px;font-size:12px;font-weight:500;cursor:pointer;transition:all .2s ease;border:none;min-width:80px;text-align:center}.notification-action.primary{background:#4a90e2;color:#fff}.notification-action.primary:hover{background:#3a7bc8;transform:translateY(-1px)}.notification-action.secondary{background:#f1f5f9;color:#475569;border:1px solid #e2e8f0}.notification-action.secondary:hover{background:#e2e8f0;border-color:#cbd5e1}.notification-progress-bar{position:absolute;bottom:0;left:0;right:0;height:3px;background:#0000000d;overflow:hidden}.notification-progress-fill{height:100%;transition:width .05s linear}.notification-toast.success .notification-progress-fill{background:#10b981}.notification-toast.error .notification-progress-fill{background:#ef4444}.notification-toast.warning .notification-progress-fill{background:#f59e0b}.notification-toast.info .notification-progress-fill{background:#4a90e2}.notification-toast.loading .notification-progress-fill{background:linear-gradient(90deg,#667eea,#764ba2)}.notification-toast:hover{box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d,0 0 0 1px #0000000d}@media(max-width:480px){.notification-container{left:12px;right:12px;bottom:12px;max-width:none}.notification-toast{padding:12px 14px}.notification-title{font-size:13px}.notification-message{font-size:12px}}@media(prefers-reduced-motion:reduce){.notification-toast{transition:opacity .2s ease;transform:none!important}.notification-toast.visible,.notification-toast.exiting{transform:none!important}.notification-spinner{animation:none}}@media(prefers-color-scheme:dark){.notification-toast{background:#1e293b;box-shadow:0 4px 6px -1px #0000004d,0 2px 4px -1px #0003,0 0 0 1px #ffffff0d}.notification-title{color:#f1f5f9}.notification-message{color:#94a3b8}.notification-dismiss{color:#64748b}.notification-dismiss:hover{background:#ffffff1a;color:#94a3b8}.notification-action.secondary{background:#334155;color:#e2e8f0;border-color:#475569}.notification-action.secondary:hover{background:#475569;border-color:#64748b}.notification-progress-bar{background:#ffffff1a}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:#0003;border-radius:4px}::-webkit-scrollbar-thumb{background:#00d4ff4d;border-radius:4px;transition:background .2s ease}::-webkit-scrollbar-thumb:hover{background:#00d4ffcc}::-webkit-scrollbar-corner{background:#0003}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg-primary);color:var(--text-primary);min-height:100vh;overflow-y:auto;overflow-x:hidden}.app-container{display:grid;grid-template-rows:70px 1fr;height:100vh;width:100vw;overflow:hidden}.header{background:#000c;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--border-glass);display:flex;align-items:center;justify-content:space-between;padding:0 20px}.logo{font-size:24px;font-weight:700;background:linear-gradient(45deg,var(--accent-blue),var(--accent-purple));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.workflow-status{display:flex;align-items:center;gap:8px}.workflow-step{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:var(--text-secondary);transition:all .3s ease}.workflow-step.active{color:var(--accent-blue)}.workflow-step.completed{color:#10b981}.workflow-icon{width:20px;height:20px;border-radius:50%;background:var(--glass-bg);border:1px solid var(--border-glass);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:600}.workflow-connector{width:20px;height:1px;background:var(--border-glass)}.header-actions{display:flex;gap:12px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:10px 20px;border:1px solid transparent;border-radius:8px;background:#fff;color:#111827;font-size:14px;font-weight:600;line-height:1.2;text-decoration:none;cursor:pointer;transition:background-color .2s ease,border-color .2s ease,color .2s ease,box-shadow .2s ease,transform .2s ease}.btn:hover{transform:translateY(-1px)}.btn:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}.btn-primary,.btn-success,.btn-add,.btn-save,.btn-create,.btn-create-first,.btn-create-submit,.btn-import-modal{color:#fff}.btn-primary:hover:not(:disabled),.btn-success:hover:not(:disabled),.btn-add:hover:not(:disabled),.btn-save:hover:not(:disabled),.btn-create:hover:not(:disabled),.btn-create-first:hover:not(:disabled),.btn-create-submit:hover:not(:disabled),.btn-import-modal:hover:not(:disabled){box-shadow:0 8px 18px #4a90e22e}.btn-primary,.btn-save,.btn-create,.btn-create-first,.btn-create-submit,.btn-import-modal{background:#4a90e2;border-color:#4a90e2}.btn-primary:hover:not(:disabled),.btn-save:hover:not(:disabled),.btn-create:hover:not(:disabled),.btn-create-first:hover:not(:disabled),.btn-create-submit:hover:not(:disabled),.btn-import-modal:hover:not(:disabled){background:#357abd;border-color:#357abd}.btn-success,.btn-add{background:#10b981;border-color:#10b981}.btn-success:hover:not(:disabled),.btn-add:hover:not(:disabled){background:#059669;border-color:#059669;box-shadow:0 8px 18px #10b9812e}.btn-secondary,.btn-cancel{background:#f9fafb;border-color:#d1d5db;color:#111827}.btn-secondary:hover:not(:disabled),.btn-cancel:hover:not(:disabled){background:#f3f4f6;border-color:#9ca3af}.btn-outline,.btn-import{background:#fff;border-color:#4a90e2;color:#4a90e2}.btn-outline:hover:not(:disabled),.btn-import:hover:not(:disabled){background:#eff6ff;border-color:#357abd;color:#357abd}.btn-danger{background:#dc2626;border-color:#dc2626;color:#fff}.btn-danger:hover:not(:disabled){background:#b91c1c;border-color:#b91c1c;box-shadow:0 8px 18px #dc26262e}.btn-ghost{background:transparent;border-color:transparent;color:#2563eb}.btn-ghost:hover:not(:disabled){background:#eff6ff;color:#1d4ed8}.btn-sm{min-height:32px;padding:6px 12px;font-size:13px}.btn-lg{min-height:44px;padding:12px 24px}.btn svg{width:16px;height:16px;flex-shrink:0}.btn-block{width:100%}.btn-icon{min-width:40px;padding:10px}.main-layout{display:flex;min-height:calc(100vh - 70px);width:100vw;overflow:hidden}.left-panel{background:#0006;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-right:1px solid var(--border-glass);display:flex;flex-direction:column;overflow:hidden;position:relative;width:350px;flex-shrink:0;transition:width .3s ease}.left-panel.collapsed{width:40px!important}.left-panel.collapsed .panel-header,.left-panel.collapsed .app-generator-container{display:none}.left-panel-toggle{position:absolute;top:10px;right:10px;background:#00d4ff1a;border:1px solid rgba(0,212,255,.3);color:#00d4ff;width:24px;height:24px;border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:12px;transition:all .2s ease;z-index:10}.left-panel-toggle:hover{background:#00d4ff33;transform:scale(1.1)}.left-panel.collapsed .left-panel-toggle{right:8px}.panel-header{padding:16px;border-bottom:1px solid var(--border-glass);font-weight:600;font-size:14px;text-transform:uppercase;letter-spacing:1px;color:var(--accent-blue)}.panel-section{padding:16px;border-bottom:1px solid var(--border-glass);overflow-y:auto}.section-title{font-size:14px;font-weight:600;margin-bottom:12px;color:var(--text-secondary)}.generation-form{display:flex;flex-direction:column;gap:12px}.form-label,.form-group label{display:block;margin-bottom:8px;font-weight:600;font-size:14px;color:#111827}.form-input,.form-textarea,.form-group input,.form-group select,.form-group textarea{width:100%;padding:10px 12px;background:#fff;border:1px solid #d1d5db;border-radius:6px;color:#111827;font-size:14px;box-sizing:border-box;transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease}.form-input::placeholder,.form-textarea::placeholder,.form-group input::placeholder,.form-group textarea::placeholder{color:#9ca3af}.form-input:focus,.form-textarea:focus,.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#4a90e2;background:#fff;box-shadow:0 0 0 3px #4a90e21a}.form-input:disabled,.form-input.disabled,.form-textarea:disabled,.form-textarea.disabled,.form-group input:disabled,.form-group select:disabled,.form-group textarea:disabled{background:#f5f5f5;color:#666;cursor:not-allowed;opacity:.7}.form-textarea{min-height:120px;resize:vertical;font-family:inherit}.generate-btn{padding:10px;background:linear-gradient(45deg,var(--accent-blue),var(--accent-purple));border:none;border-radius:8px;color:#fff;font-weight:500;cursor:pointer;transition:all .3s ease}.step-functions-monitor{display:flex;flex-direction:column;gap:8px}.step-item{display:flex;align-items:center;gap:8px;padding:8px;background:var(--glass-bg);border-radius:6px}.step-status{width:12px;height:12px;border-radius:50%}.step-status.completed{background:#10b981}.step-status.active{background:var(--accent-blue);animation:pulse 1.5s infinite}.step-status.pending{background:var(--text-secondary)}.step-name{font-size:12px;color:var(--text-primary)}.center-panel{display:flex;flex-direction:column;background:#0003;flex:1;min-width:0;overflow:hidden}.tabs{display:flex;background:#000c;border-bottom:1px solid var(--border-glass);position:relative}.tab{padding:12px 20px;cursor:pointer;border-bottom:2px solid transparent;background:#000c;transition:all .3s ease;font-size:14px;font-weight:500;color:var(--text-secondary)}.tab.active{border-bottom-color:var(--accent-blue);background:#00d4ff1a;color:var(--text-primary)}.tab:hover:not(.active){background:#ffffff1a;color:var(--text-primary)}.view-toggle{position:absolute;right:16px;top:50%;transform:translateY(-50%);display:flex;background:#0000004d;border-radius:6px;padding:2px}.view-btn{background:transparent;border:none;width:28px;height:28px;border-radius:4px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--text-secondary);transition:all .2s ease}.view-btn.active{background:#00d4ff33;color:var(--accent-blue)}.editor-container{flex:1;display:flex;overflow:hidden}.json-editor{display:flex;width:100%;height:100%}.tree-controls{padding:8px 12px;background:linear-gradient(135deg,#16213ef2,#1a1a2ef2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid rgba(0,212,255,.2);display:flex;align-items:center;gap:8px;flex-wrap:wrap;box-shadow:0 2px 8px #0000004d}.tree-control-btn,.theme-selector{background:linear-gradient(135deg,#1e293bcc,#334155cc);border:1px solid rgba(148,163,184,.3);color:#e2e8f0;padding:0 12px;border-radius:6px;font-size:11px;font-weight:500;cursor:pointer;transition:all .2s ease;position:relative;overflow:hidden;white-space:nowrap;height:25px;box-sizing:border-box;width:100%;display:center;align-items:center;justify-content:center;gap:4px;-webkit-user-select:none;user-select:none;line-height:1}.theme-selector{padding-right:32px;justify-content:flex-start;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:url("data:image/svg+xml;charset=US-ASCII,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 4 5'><path fill='%23e2e8f0' d='M2 0L0 2h4zm0 5L0 3h4z'/></svg>");background-repeat:no-repeat;background-position:right 10px center;background-size:10px}.tree-control-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.05),transparent);transition:left .4s ease}.tree-control-btn:hover,.theme-selector:hover{background:linear-gradient(135deg,#334155e6,#475569e6);border-color:#94a3b880;color:#f1f5f9;box-shadow:0 2px 8px #0003}.tree-control-btn:hover:before{left:100%}.tree-control-btn:active,.theme-selector:active{transform:scale(.98);box-shadow:0 1px 4px #0003}.tree-control-btn:focus,.theme-selector:focus{outline:none;box-shadow:0 0 0 2px #94a3b866;border-color:#94a3b899}.theme-selector option{background:#1e293b!important;background-color:#1e293b!important;color:#e2e8f0!important;padding:8px 12px;border:none;font-weight:500;font-size:11px;height:32px;line-height:32px}.theme-selector option:hover,.theme-selector option:checked,.theme-selector option:focus{background:#334155!important;background-color:#334155!important;color:#f1f5f9!important}.theme-selector::-webkit-scrollbar{width:8px}.theme-selector::-webkit-scrollbar-track{background:#1e293b}.theme-selector::-webkit-scrollbar-thumb{background:#475569;border-radius:4px}.theme-selector::-webkit-scrollbar-thumb:hover{background:#64748b}.theme-selector optgroup{background:#1e293b!important;color:#e2e8f0!important}.tree-control-btn.active{background:linear-gradient(135deg,#3b82f633,#6366f133);border-color:#3b82f666;color:#dbeafe;box-shadow:0 0 0 1px #3b82f64d}.tree-control-btn:disabled,.theme-selector:disabled{opacity:.4;cursor:not-allowed;background:#1e293b80;border-color:#94a3b833;color:#64748b}.tree-control-btn:disabled:hover,.theme-selector:disabled:hover{transform:none;box-shadow:none;background:#1e293b80}.tree-control-btn[data-tooltip]:after{content:attr(data-tooltip);position:absolute;bottom:-28px;left:50%;transform:translate(-50%);background:#0f172af2;color:#e2e8f0;padding:4px 8px;border-radius:4px;font-size:10px;font-weight:400;white-space:nowrap;opacity:0;pointer-events:none;transition:all .2s ease;z-index:1000;border:1px solid rgba(148,163,184,.2)}.tree-control-btn[data-tooltip]:hover:after{opacity:1;bottom:-25px}.tree-control-btn.loading:after{content:"";position:absolute;top:50%;left:50%;width:12px;height:12px;border:1.5px solid transparent;border-top:1.5px solid #e2e8f0;border-radius:50%;transform:translate(-50%,-50%);animation:spin 1s linear infinite}@keyframes spin{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}@media(max-width:768px){.tree-controls{padding:6px 8px;gap:6px}.tree-control-btn,.theme-selector{height:28px;min-height:28px;max-height:28px;padding:0 8px;font-size:10px}.theme-selector{min-width:100px;padding-right:24px}}@media(prefers-reduced-motion:reduce){.tree-control-btn,.theme-selector,.tree-control-btn:before{transition:none}}.tree-control-btn:focus-visible,.theme-selector:focus-visible{outline:2px solid rgba(148,163,184,.6);outline-offset:1px}.tree-expand-icon{width:16px;height:16px;display:flex;align-items:center;justify-content:center;font-size:10px;color:#888;cursor:pointer;border-radius:2px;transition:all .2s ease}.tree-children{border-left:1px solid rgba(255,255,255,.1);margin-left:8px;animation:expand .2s ease-out}@keyframes expand{0%{opacity:0;max-height:0}to{opacity:1;max-height:1000px}}.highlighted-line{background-color:#00d4ff33!important;animation:highlight-fade 2s ease-out}@keyframes highlight-fade{0%{background-color:#00d4ff66!important;box-shadow:0 0 10px #00d4ff4d}to{background-color:#00d4ff1a!important;box-shadow:none}}.tree-view{background:linear-gradient(135deg,#0006,#16213e33);border-right:1px solid var(--border-glass);padding:0;overflow-y:auto;overflow-x:hidden;position:relative;flex-shrink:0;height:100%;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.tree-resizer{width:4px;background:#00d4ff1a;cursor:col-resize;position:relative;flex-shrink:0;height:100%;z-index:100;min-width:4px;max-width:4px;border-left:1px solid rgba(0,212,255,.2);border-right:1px solid rgba(0,212,255,.2);transition:all .2s ease}.tree-resizer:hover{background:#00d4ff66;width:6px;border-color:#00d4ff99}.left-panel.collapsed~.left-resizer~.center-panel .tree-resizer{background:#00d4ff4d;border-color:#00d4ff80;width:5px}.left-panel.collapsed~.left-resizer~.center-panel .tree-resizer:hover{background:#00d4ff99;border-color:#00d4ffcc;width:7px}.center-panel:first-child .tree-resizer{background:#00d4ff33;border-color:#00d4ff66;width:5px}.center-panel:first-child .tree-resizer:hover{background:#00d4ff80;border-color:#00d4ffb3;width:7px}.tree-view:hover{border-right-color:var(--accent-blue)}.tree-view:after{content:"";position:absolute;top:50%;right:-1px;width:2px;height:30px;background:#00d4ff4d;transform:translateY(-50%);opacity:0;transition:opacity .2s ease}.tree-view:hover:after{opacity:1}.tree-item{display:flex;align-items:center;justify-content:space-between;padding:6px 8px;border-radius:4px;cursor:pointer;font-size:12px;margin-bottom:2px;transition:all .2s ease;white-space:nowrap;width:100%;position:relative;overflow:hidden;gap:8px}.tree-item-content{display:flex;align-items:center;gap:6px;flex:1;min-width:0;overflow:hidden}.tree-clear-btn{background:#ef444414;border:1px solid rgba(239,68,68,.2);color:#ef4444b3;width:18px;height:18px;border-radius:3px;cursor:pointer;font-size:9px;font-weight:600;display:flex;align-items:center;justify-content:center;margin-right:100px;flex-shrink:0;opacity:0;transition:all .2s ease;position:relative;z-index:10;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.tree-item:hover .tree-clear-btn{opacity:1;transform:scale(1)}.tree-clear-btn:hover{background:#ef444426;border-color:#ef444466;color:#ef4444;transform:scale(1.1);box-shadow:0 2px 8px #ef444440}.tree-clear-btn:active{transform:scale(.95);background:#ef444433}.tree-clear-btn:before{content:"";position:absolute;inset:-2px;background:linear-gradient(45deg,#ef44441a,#ef44440d,#ef44441a);border-radius:4px;opacity:0;transition:opacity .2s ease;z-index:-1}.tree-clear-btn:hover:before{opacity:1}.tree-icon{color:var(--accent-blue);margin-right:4px;flex-shrink:0}.tree-key{color:var(--text-primary);font-weight:500;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.tree-item:hover{background:var(--glass-bg);border-radius:6px}.tree-item.selected{background:#00d4ff26;border-left:3px solid var(--accent-blue);border-radius:0 6px 6px 0}@keyframes fadeInButton{0%{opacity:0;transform:scale(.8) translate(10px)}to{opacity:1;transform:scale(1) translate(0)}}.tree-item:hover .tree-clear-btn{animation:fadeInButton .2s ease-out}.tree-expand-icon{color:var(--text-secondary);font-size:10px;width:16px;height:16px;display:flex;align-items:center;justify-content:center;border-radius:2px;transition:all .2s ease;flex-shrink:0}.tree-expand-icon:hover{background:#ffffff1a;color:#00d4ff;transform:scale(1.1)}.left-resizer{width:6px;background:#00d4ff1a;cursor:col-resize;position:relative;flex-shrink:0;height:100%;border-left:1px solid rgba(0,212,255,.2);border-right:1px solid rgba(0,212,255,.2);transition:all .2s ease;z-index:100;min-width:6px;max-width:6px}.left-resizer:hover{background:#00d4ff66;border-color:#00d4ff99;width:8px}.left-panel.collapsed+.left-resizer{background:#00d4ff4d;border-color:#00d4ff80;width:5px}.left-panel.collapsed+.left-resizer:hover{background:#00d4ff99;border-color:#00d4ffcc;width:7px}.right-resizer{width:4px;background:#00d4ff1a;cursor:col-resize;position:relative;flex-shrink:0;height:100%;z-index:100;min-width:4px;max-width:4px;border-left:1px solid rgba(0,212,255,.2);border-right:1px solid rgba(0,212,255,.2)}.right-resizer:hover{background:#00d4ff66;width:6px;border-color:#00d4ff99}.left-resizer:hover{background:#00d4ff66;border-color:#00d4ff99}.tree-clear-btn:after{content:"Eliminar";position:absolute;bottom:-25px;left:50%;transform:translate(-50%);background:#000c;color:#fff;padding:2px 6px;border-radius:3px;font-size:10px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s ease;z-index:1000}.tree-clear-btn:hover:after{opacity:1}.monaco-editor{background:#0a0a1a;overflow:auto;position:relative;flex:1;min-width:300px;height:100%}.code-preview{font-family:Consolas,Monaco,monospace;color:var(--text-primary);white-space:pre-wrap;font-size:14px;line-height:1.5;outline:none}.json-highlight-editor{font-family:Consolas,Monaco,monospace;white-space:pre-wrap;font-size:14px;line-height:1.5}.json-highlight-editor span{font-family:inherit}.preview-container{width:100%;height:100%;display:flex;flex-direction:column}.preview-header{display:flex;justify-content:space-between;align-items:center;padding:12px;border-bottom:1px solid var(--border-glass)}.preview-actions{display:flex;gap:8px}.preview-btn{width:32px;height:32px;border-radius:4px;background:var(--glass-bg);border:1px solid var(--border-glass);color:var(--text-primary);cursor:pointer}.preview-content{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:16px;overflow:auto}.mobile-preview,.web-preview{display:flex;justify-content:center}.mobile-frame{width:320px;height:600px;background:#fff;border-radius:24px;overflow:hidden;border:10px solid #333}.web-frame{width:100%;height:600px;background:#fff;border-radius:8px;overflow:hidden;border:2px solid #333}.form-preview{padding:16px}.form-field{margin-bottom:16px}.form-field label{display:block;margin-bottom:4px;font-size:14px;color:#333}.form-field input{width:100%;padding:8px;border:1px solid #ddd;border-radius:4px}.form-button{width:100%;padding:10px;background:linear-gradient(45deg,var(--accent-blue),var(--accent-purple));border:none;border-radius:4px;color:#fff;cursor:pointer}.visual-editor,.scripts-container{width:100%;height:100%;display:flex;flex-direction:column;background-color:#1e1e1e;color:#e0e0e0}.visual-editor-header{padding:12px;border-bottom:1px solid var(--border-glass)}.visual-editor-content{flex:1;display:grid;grid-template-columns:200px 1fr}.element-palette{background:#0000004d;border-right:1px solid var(--border-glass);padding:12px;overflow-y:auto}.palette-item{padding:8px;margin-bottom:4px;background:var(--glass-bg);border-radius:4px;cursor:pointer;font-size:12px}.canvas{padding:20px;overflow:auto}.canvas-element{background:#fff;border-radius:8px;padding:16px;margin-bottom:16px;width:400px}.element-header{color:#333;font-size:14px;margin-bottom:8px}.right-panel{background:#0006;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-left:2px solid #333;display:flex;flex-direction:column;width:380px;min-width:300px;max-width:600px;flex-shrink:0;position:relative;transition:width .3s ease,min-width .3s ease;overflow:hidden}.token-metrics{display:flex;flex-direction:column;gap:2px;margin-top:4px;font-size:9px;opacity:.7}.metric-item{color:var(--text-secondary);font-family:Consolas,Monaco,monospace;font-weight:400;letter-spacing:.3px;display:flex;align-items:center;gap:3px}.metric-item:hover{opacity:1;color:var(--accent-blue);transition:all .2s ease}.panel-header-modern{padding:12px 16px;background:linear-gradient(135deg,#0009,#16213e66);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border-glass);display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.header-content{display:flex;align-items:flex-start;gap:10px;flex:1}.header-icon{font-size:18px;margin-top:2px}.header-text{display:flex;flex-direction:column;gap:2px}.header-text h3{margin:0;font-size:14px;font-weight:600;color:var(--text-primary)}.header-subtitle{font-size:11px;color:var(--text-secondary);font-weight:400}.status-indicator{width:8px;height:8px;border-radius:50%;margin-top:4px;flex-shrink:0}.status-indicator.online{background:#10b981;box-shadow:0 0 6px #10b98166;animation:pulse-green 2s infinite}@keyframes pulse-green{0%,to{opacity:1}50%{opacity:.6}}.ai-assistant-panel{display:flex;flex-direction:column;height:100%;background:#0003}.chat-container-modern{flex:1;display:flex;flex-direction:column;overflow:hidden}.chat-wrapper{flex:1;overflow:hidden}.ai-chat{flex:1;display:flex;flex-direction:column;padding:16px}.chat-messages{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:12px;margin-bottom:16px}.message{max-width:80%;padding:10px 12px;border-radius:12px;font-size:13px}.message.assistant{align-self:flex-start;background:#00d4ff1a;border:1px solid rgba(0,212,255,.3)}.message.user{align-self:flex-end;background:#9c40ff1a;border:1px solid rgba(156,64,255,.3)}.chat-input{display:flex;gap:8px}.ai-input{flex:1;padding:10px;background:var(--glass-bg);border:1px solid var(--border-glass);border-radius:8px;color:var(--text-primary)}.ai-send-btn{padding:10px 16px;background:linear-gradient(45deg,var(--accent-blue),var(--accent-purple));border:none;border-radius:8px;color:#fff;cursor:pointer;font-weight:500;transition:all .3s ease;min-width:80px}.ai-send-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 5px 15px #00d4ff4d}.ai-send-btn:disabled{background:#ffffff1a;cursor:not-allowed;transform:none}.ai-input:disabled{opacity:.6;cursor:not-allowed}.message p{margin:0;line-height:1.4;word-wrap:break-word}.chat-messages::-webkit-scrollbar{width:4px}.chat-messages::-webkit-scrollbar-track{background:transparent}.chat-messages::-webkit-scrollbar-thumb{background:#00d4ff4d;border-radius:2px}.chat-messages::-webkit-scrollbar-thumb:hover{background:#00d4ff80}.chat-context-selector{padding:12px 16px;border-bottom:1px solid var(--border-glass)}.context-select{width:100%;padding:8px 12px;background:var(--glass-bg);border:1px solid var(--border-glass);border-radius:6px;color:var(--text-primary);font-size:13px;cursor:pointer;transition:all .2s ease}.context-select:focus{outline:none;border-color:var(--accent-blue);box-shadow:0 0 0 2px #00d4ff1a}.context-select option{background:#1a1a2e;color:var(--text-primary);padding:8px}.chat-discard{margin-top:8px;display:flex;justify-content:center}.discard-btn{padding:6px 12px;background:linear-gradient(45deg,#ef4444,#dc2626);border:none;border-radius:6px;color:#fff;font-size:12px;font-weight:500;cursor:pointer;transition:all .3s ease;min-width:120px}.discard-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px #ef44444d;background:linear-gradient(45deg,#dc2626,#b91c1c)}.discard-btn:active{transform:translateY(0);box-shadow:0 2px 6px #ef444433}.properties-panel{padding:16px;overflow-y:auto}.property-group{margin-bottom:20px}.property-group-title{font-size:12px;font-weight:600;color:var(--accent-purple);margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}.property-item{margin-bottom:12px}.property-label{display:block;font-size:12px;color:var(--text-secondary);margin-bottom:4px}.property-input{width:100%;background:var(--glass-bg);border:1px solid var(--border-glass);border-radius:4px;padding:6px 8px;color:var(--text-primary);font-size:12px}.modal-overlay{position:fixed;inset:0;background:#000c;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;z-index:1000}.streamlit-modal{width:90%;max-width:1000px;max-height:90vh;background:var(--bg-primary);border-radius:12px;border:1px solid var(--border-glass);overflow:hidden;box-shadow:0 25px 50px #00000080}.streamlit-integration{display:flex;flex-direction:column;height:100%;max-height:90vh}.integration-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;background:#00000080;border-bottom:1px solid var(--border-glass)}.integration-header h2{font-size:18px;font-weight:600;background:linear-gradient(45deg,var(--accent-blue),var(--accent-purple));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.close-btn{background:transparent;border:none;color:var(--text-secondary);font-size:20px;cursor:pointer;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s}.close-btn:hover{background:#ffffff1a;color:var(--text-primary)}.integration-content{flex:1;overflow-y:auto;padding:0 20px 20px}.file-generated-panel{padding:16px 20px;background:#0000004d;border-top:1px solid var(--border-glass);display:flex;justify-content:space-between;align-items:center}.file-info{display:flex;align-items:center;gap:12px}.file-icon{font-size:24px}.file-details h3{font-size:14px;font-weight:500;color:var(--text-primary)}.file-details p{font-size:12px;color:var(--text-secondary)}.download-btn{padding:8px 16px;background:linear-gradient(45deg,var(--accent-blue),var(--accent-purple));border:none;border-radius:6px;color:#fff;font-weight:500;cursor:pointer;transition:all .2s}.download-btn:hover{transform:translateY(-2px);box-shadow:0 5px 15px #00d4ff4d}.app-generator{padding:20px;height:100%;overflow-y:auto;background:#0000001a}.generator-header{text-align:center;margin-bottom:10px;padding:8px 0}.generator-header h2{font-size:18px;margin-bottom:4px}.generator-header p{font-size:12px;opacity:.8;margin:0}.generator-header h2{background:linear-gradient(45deg,var(--accent-blue),var(--accent-purple));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:10px}.generator-header p{color:var(--text-secondary);font-size:14px}.generator-content{display:flex;flex-direction:column;height:100%;width:100%;padding:12px;box-sizing:border-box}.form-section{background:var(--glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:25px;border-radius:12px;border:1px solid var(--border-glass)}.form-section h3{color:var(--text-primary);margin-bottom:20px;font-size:18px}.form-divider{margin:30px 0;border:none;border-top:1px solid var(--border-glass);opacity:.5}.form-group{margin-bottom:20px}.form-group textarea{resize:vertical;min-height:100px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}.checkbox-label{display:flex!important;align-items:center;cursor:pointer;color:var(--text-primary)!important}.checkbox-label input{width:auto!important;margin-right:10px;margin-bottom:0}.form-actions{display:flex;gap:15px;margin-top:25px}.generate-btn,.download-btn{padding:12px 24px;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease}.generate-btn{background:linear-gradient(135deg,var(--accent-blue),var(--accent-purple));color:#fff;flex:1}.generate-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 25px #00d4ff4d}.generate-btn:disabled{background:#ffffff1a;cursor:not-allowed;transform:none}.download-btn{background:linear-gradient(135deg,#10b981,#059669);color:#fff}.download-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #10b9814d}.status-message{margin-top:20px;padding:15px;border-radius:8px;font-weight:500;background:#00d4ff1a;color:var(--accent-blue);border-left:4px solid var(--accent-blue)}.chat-section{background:var(--glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:25px;border-radius:12px;border:1px solid var(--border-glass);height:fit-content}.chat-section h3{color:var(--text-primary);margin-bottom:20px;font-size:18px}.chat-messages{max-height:400px;overflow-y:auto;border:1px solid var(--border-glass);border-radius:8px;padding:15px;background:#0003}.message{margin-bottom:15px;padding:12px;border-radius:8px;line-height:1.5;font-size:13px}.message.assistant{background:#00d4ff1a;color:var(--text-primary);border-left:4px solid var(--accent-blue)}.message.user{background:#9c40ff1a;color:var(--text-primary);border-left:4px solid var(--accent-purple)}.aws-status{display:flex;align-items:center;gap:10px;padding:10px 15px;border-radius:8px;margin-bottom:15px;font-size:14px}.aws-status.connected{background:#10b9811a;border-left:4px solid #10b981}.aws-status.pending{background:#f59e0b1a;border-left:4px solid #f59e0b}.aws-status.no-credentials{background:#ef44441a;border-left:4px solid #ef4444}.aws-status-icon{font-size:18px}.aws-status-text{font-weight:500}.s3-info{margin-top:15px;padding:10px;background:#0003;border-radius:6px;font-size:12px;display:flex;flex-direction:column;gap:5px}.s3-info-title{font-weight:600;color:var(--accent-blue)}.s3-info-value{font-family:Courier New,monospace;word-break:break-all}@media(max-width:768px){.generator-content,.form-row{grid-template-columns:1fr}.form-actions{flex-direction:column}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.left-panel-tabs{display:flex;border-bottom:1px solid var(--border-glass);margin-bottom:10px}.left-tab{flex:1;padding:8px 12px;border:none;background:transparent;color:var(--text-secondary);cursor:pointer;font-size:12px;font-weight:500;transition:all .2s ease;border-radius:4px 4px 0 0}.left-tab.active{background:var(--accent-blue);color:#fff}.left-tab:hover:not(.active){background:var(--glass-bg);color:var(--text-primary)}.app-generator-container{flex:1;overflow-y:auto;padding:16px}.loading-indicator{display:flex;align-items:center;justify-content:center;height:100vh;background:var(--bg-primary);color:var(--text-primary);font-size:16px}.header .btn{white-space:nowrap;min-width:auto}.header .btn-secondary{margin-right:10px}.logo img{width:40px;height:40px;margin-right:10px;vertical-align:middle}.saving-indicator{font-size:.8em;margin-left:10px;color:#4caf50;animation:pulse 1.5s infinite}@media(max-width:1200px){.left-panel{width:300px}.right-panel{width:350px}}@media(max-width:768px){.header{padding:0 10px;flex-wrap:wrap;gap:10px}.header-actions{flex-wrap:wrap;gap:8px}.left-panel{width:280px}.right-panel{width:320px}.main-layout{flex-direction:column;height:auto}}.header-user-section{display:flex;align-items:center;gap:10px}.btn-space-return{margin-right:10px;background:#00d4ff!important;border-color:#00d4ff!important}.btn-builder-exit{margin-right:10px;background:#ff6b6b!important;border-color:#ff6b6b!important}.btn-reset{margin-left:10px;background-color:#f44336!important}.logo-image{width:40px;height:40px;margin-right:10px}.preview-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;text-align:center}.preview-empty-icon{font-size:3rem;margin-bottom:1rem}.preview-empty-title{font-size:1.5rem;margin-bottom:1rem}.preview-empty-text{font-size:1rem;opacity:.8;max-width:400px}.preview-error-state{margin-top:2rem;padding:1rem 2rem;background:#ffffff1a;border-radius:10px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.preview-error-icon{font-size:3rem;margin-bottom:1rem}.preview-error-title{font-size:1.5rem;margin-bottom:1rem}.preview-error-text{font-size:1rem;opacity:.8;max-width:400px}:root{--bg-primary: linear-gradient(135deg, #0a0a0a 0%, #1a1a2e 50%, #16213e 100%);--accent-blue: #00d4ff;--accent-purple: #9c40ff;--glass-bg: rgba(255, 255, 255, .05);--border-glass: rgba(255, 255, 255, .1);--text-primary: #111827;--text-secondary: rgba(255, 255, 255, .7)}*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;width:100%}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;background:var(--bg-primary);color:var(--text-primary);line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{height:100%}code,pre,.code-font{font-family:JetBrains Mono,monospace}button,input,select,textarea{font-family:inherit}.glass{background:#ffffff0d;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-radius:8px}.glass-dark{background:#0006;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-radius:8px}.gradient-text{background:linear-gradient(45deg,var(--accent-blue),var(--accent-purple));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.gradient-bg{background:linear-gradient(45deg,var(--accent-blue),var(--accent-purple))}.modal-content-no-padding{padding:0!important}