:root,[data-theme=slate]{--brand-primary:#4a556d;--brand-primary-light:#5d6a85;--brand-secondary:#9dbcb0;--brand-accent:#e4cfa1;--brand-dark:#3e415a;--brand-black:#2b2f42;--brand-white:#fff;--logo-blue-gray:#6d7b99;--accent-coral:#ff5757;--accent-coral-light:#ff575726;--accent-coral-dark:#e04a4a;--accent-coral-glow:#ff575740;--accent-coral-text:#1a1a2e;--color-primary:var(--brand-primary);--color-secondary:var(--brand-secondary);--color-accent:var(--brand-accent);--color-cta:var(--accent-coral);--color-text:var(--brand-black);--color-background:var(--brand-white);--mape-orange:var(--brand-primary);--mape-peach:var(--brand-accent);--mape-blue:var(--brand-secondary);--mape-dark-orange:var(--brand-dark);--mape-black:var(--brand-black);--mape-white:var(--brand-white);--brand-primary-glow:#4a556d26;--brand-secondary-light:#b5d0c5;--brand-secondary-glow:#9dbcb033;--mape-orange-light:var(--brand-primary-light);--mape-orange-glow:var(--brand-primary-glow);--mape-blue-light:var(--brand-secondary-light);--mape-blue-glow:var(--brand-secondary-glow);--bg-white:#fff;--bg-light:#f6f3ea;--bg-card:#fff;--bg-card-hover:#f0ede4;--bg-dark:#3e415a;--text-primary:#2b2f42;--text-secondary:#4a4f66;--text-muted:#7a7f95;--text-inverse:#f4f6fc;--border-color:#d8d5cc;--border-light:#e8e5dc;--border-dark:#c5c2b9;--color-success:#9dbcb0;--color-success-bg:#9dbcb033;--color-warning:#f59e0b;--color-warning-bg:#f59e0b1a;--color-error:#ef4444;--color-error-bg:#ef44441a;--color-info:var(--brand-secondary);--color-info-bg:var(--brand-secondary-glow);--shadow-sm:0 1px 2px #0000000d;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;--shadow-primary:0 4px 14px #4a556d33;--shadow-secondary:0 4px 14px #9dbcb040;--shadow-coral:0 4px 14px var(--accent-coral-glow);--shadow-orange:var(--shadow-primary);--shadow-blue:var(--shadow-secondary);--theme-name:"slate"}[data-theme=mape]{--brand-primary:#f93;--brand-primary-light:#ffa64c;--brand-secondary:#6cf;--brand-accent:#ffa64c;--brand-dark:#e67333;--brand-black:#000;--brand-white:#fff;--logo-blue-gray:#6d7b99;--accent-coral:#ff5757;--accent-coral-light:#ff575726;--accent-coral-dark:#e04a4a;--accent-coral-glow:#ff575740;--color-primary:var(--brand-primary);--color-secondary:var(--brand-secondary);--color-accent:var(--brand-accent);--color-cta:var(--accent-coral);--color-text:var(--brand-black);--color-background:var(--brand-white);--mape-orange:var(--brand-primary);--mape-peach:var(--brand-primary-light);--mape-blue:var(--brand-secondary);--mape-dark-orange:var(--brand-dark);--mape-black:var(--brand-black);--mape-white:var(--brand-white);--brand-primary-glow:#f933;--brand-secondary-light:#9df;--brand-secondary-glow:#66ccff26;--mape-orange-light:#ffb366;--mape-orange-glow:var(--brand-primary-glow);--mape-blue-light:var(--brand-secondary-light);--mape-blue-glow:var(--brand-secondary-glow);--bg-white:#fff;--bg-light:#fafbfc;--bg-card:#fff;--bg-card-hover:#f8f9fa;--bg-dark:#1a1a2e;--text-primary:#1a1a2e;--text-secondary:#6b7280;--text-muted:#9ca3af;--text-inverse:#fff;--border-color:#e5e7eb;--border-light:#f3f4f6;--border-dark:#d1d5db;--color-success:#22c55e;--color-success-bg:#22c55e1a;--color-warning:#f59e0b;--color-warning-bg:#f59e0b1a;--color-error:#ef4444;--color-error-bg:#ef44441a;--color-info:var(--brand-secondary);--color-info-bg:var(--brand-secondary-glow);--shadow-sm:0 1px 2px #0000000d;--shadow-md:0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;--shadow-lg:0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;--shadow-primary:0 4px 14px #ff993340;--shadow-secondary:0 4px 14px #66ccff40;--shadow-coral:0 4px 14px var(--accent-coral-glow);--shadow-orange:var(--shadow-primary);--shadow-blue:var(--shadow-secondary);--theme-name:"mape"}[data-mode=dark]{--bg-white:#2b2f42;--bg-light:#3e415a;--bg-card:#34374d;--bg-card-hover:#3e415a;--bg-dark:#1a1a2e;--text-primary:#f4f6fc;--text-secondary:#d1d5db;--text-muted:#9ca3af;--text-inverse:#2b2f42;--border-color:#4a4f66;--border-light:#3e415a;--border-dark:#2b2f42;--shadow-sm:0 1px 2px #0000004d;--shadow-md:0 4px 6px -1px #0006;--shadow-lg:0 10px 15px -3px #00000080;--color-text:var(--text-primary);--color-background:var(--bg-white);--color-success-bg:#9dbcb01a;--color-warning-bg:#f59e0b0d;--color-error-bg:#ef44440d}
:root{--font-primary:"Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-mono:"JetBrains Mono", "Fira Code", "Consolas", monospace;--text-xs:12px;--text-sm:13px;--text-base:14px;--text-md:16px;--text-lg:18px;--text-xl:20px;--text-2xl:24px;--text-3xl:28px;--text-4xl:32px;--text-5xl:36px;--font-light:300;--font-regular:400;--font-medium:500;--font-semibold:600;--font-bold:700;--leading-tight:1.25;--leading-normal:1.5;--leading-relaxed:1.75;--tracking-tight:-.02em;--tracking-normal:0;--tracking-wide:.02em;--tracking-wider:.05em}h1,.h1{font-size:var(--text-4xl);font-weight:var(--font-bold);line-height:var(--leading-tight);color:var(--text-primary);margin:0 0 var(--space-md) 0}h2,.h2{font-size:var(--text-2xl);font-weight:var(--font-semibold);line-height:var(--leading-tight);color:var(--text-primary);margin:0 0 var(--space-md) 0}h3,.h3{font-size:var(--text-xl);font-weight:var(--font-semibold);line-height:var(--leading-tight);color:var(--text-primary);margin:0 0 var(--space-sm) 0}h4,.h4{font-size:var(--text-lg);font-weight:var(--font-semibold);line-height:var(--leading-normal);color:var(--text-primary);margin:0 0 var(--space-sm) 0}p{font-size:var(--text-base);line-height:var(--leading-normal);color:var(--text-primary);margin:0 0 var(--space-md) 0}.caption,small{font-size:var(--text-xs);font-weight:var(--font-light);color:var(--text-muted)}code,pre{font-family:var(--font-mono);font-size:var(--text-sm)}a{color:var(--color-secondary);text-decoration:none;transition:color .2s}a:hover{color:var(--brand-dark);text-decoration:underline}
:root{--space-0:0;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--space-3xl:64px;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-2xl:20px;--radius-full:9999px;--container-sm:640px;--container-md:768px;--container-lg:1024px;--container-xl:1200px;--container-2xl:1400px;--z-dropdown:10;--z-sticky:20;--z-fixed:30;--z-modal-backdrop:40;--z-modal:50;--z-popover:60;--z-tooltip:70;--transition-fast:.15s ease;--transition-normal:.2s ease;--transition-slow:.3s ease}
*,:before,:after{box-sizing:border-box}*{margin:0;padding:0}html{-moz-text-size-adjust:none;text-size-adjust:none}body{min-height:100vh;line-height:var(--leading-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}ul,ol{list-style:none}h1,h2,h3,h4,button,input,label{line-height:var(--leading-tight)}h1,h2,h3,h4{text-wrap:balance}a:not([class]){text-decoration-skip-ink:auto;color:currentColor}img,picture,video,canvas,svg{max-width:100%;display:block}input,button,textarea,select{font:inherit;color:inherit}textarea:not([rows]){min-height:10em}:target{scroll-margin-block:5ex}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
html{scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-primary);font-size:var(--text-base);font-weight:var(--font-regular);color:var(--text-primary);background-color:var(--bg-light)}::selection{background:var(--brand-accent);color:var(--text-primary)}::selection{background:var(--brand-accent);color:var(--text-primary)}:focus-visible{outline:2px solid var(--accent-coral);outline-offset:2px}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-light)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}pre{overflow-x:auto;background:var(--bg-dark)!important;padding:var(--space-md)!important;border-radius:var(--radius-lg)!important;border:none!important}code{font-family:var(--font-mono);font-size:var(--text-sm)}:not(pre)>code{background:var(--bg-card-hover);border-radius:var(--radius-sm);padding:2px 6px;font-size:.9em}hr{border:none;border-top:1px solid var(--border-light);margin:var(--space-lg) 0}table{border-collapse:collapse;width:100%;font-size:var(--text-sm)}th,td{border:1px solid var(--border-color);padding:var(--space-sm) var(--space-md);text-align:left}th{background:var(--bg-light);font-weight:var(--font-semibold);color:var(--text-secondary);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:var(--tracking-wide)}tr:nth-child(2n){background:var(--bg-light)}blockquote{border-left:4px solid var(--brand-primary);padding-left:var(--space-md);margin:var(--space-md) 0;color:var(--text-secondary);font-style:italic}.container{width:100%;max-width:var(--container-xl);padding:0 var(--space-md);margin:0 auto}.container-sm{max-width:var(--container-sm)}.container-md{max-width:var(--container-md)}.container-lg{max-width:var(--container-lg)}.container-2xl{max-width:var(--container-2xl)}
.btn{justify-content:center;align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-md);cursor:pointer;font-family:var(--font-primary);font-size:var(--text-base);font-weight:var(--font-semibold);transition:all var(--transition-normal);white-space:nowrap;border:none;text-decoration:none;display:inline-flex}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--accent-coral);color:var(--text-inverse);box-shadow:var(--shadow-coral)}.btn-primary:hover:not(:disabled){background:var(--accent-coral-dark);box-shadow:0 6px 20px var(--accent-coral-glow);transform:translateY(-2px)}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-brand{background:var(--brand-primary);color:var(--text-inverse);box-shadow:var(--shadow-primary)}.btn-brand:hover:not(:disabled){background:var(--brand-dark);transform:translateY(-2px)}.btn-brand:active:not(:disabled){transform:translateY(0)}.btn-coral{background:var(--accent-coral);color:var(--text-inverse);box-shadow:var(--shadow-coral)}.btn-coral:hover:not(:disabled){background:var(--accent-coral-dark);transform:translateY(-2px)}.btn-secondary{background:var(--bg-white);color:var(--text-secondary);border:1px solid var(--border-color)}.btn-secondary:hover:not(:disabled){border-color:var(--brand-primary);color:var(--brand-primary)}.btn-outline{background:var(--bg-white);color:var(--text-secondary);border:1px solid var(--border-color)}.btn-outline:hover:not(:disabled){background:var(--bg-card-hover);color:var(--text-primary);border-color:var(--brand-primary)}.btn-ghost{color:var(--text-secondary);background:0 0;border:none}.btn-ghost:hover:not(:disabled){background:var(--bg-card-hover);color:var(--text-primary)}.btn-danger{background:var(--color-error);color:var(--brand-white)}.btn-danger:hover:not(:disabled){background:#dc2626;transform:translateY(-1px)}.btn-success{background:var(--color-success);color:var(--brand-white)}.btn-success:hover:not(:disabled){opacity:.9;transform:translateY(-1px)}.btn-generate{background:var(--accent-coral);color:var(--text-inverse);box-shadow:var(--shadow-coral)}.btn-generate:hover:not(:disabled){background:var(--accent-coral-dark);transform:translateY(-2px)}.btn-sm{padding:var(--space-xs) var(--space-sm);font-size:var(--text-sm);border-radius:var(--radius-sm)}.btn-lg{padding:var(--space-md) var(--space-xl);font-size:var(--text-md);border-radius:var(--radius-lg)}.btn-icon{padding:var(--space-sm);aspect-ratio:1}.btn-icon.btn-sm{padding:var(--space-xs)}.btn-icon.btn-lg{padding:var(--space-md)}.btn-group{gap:var(--space-sm);display:flex}.btn-group-vertical{flex-direction:column}.code-button{padding:var(--space-sm) var(--space-md);font-size:var(--text-sm);font-weight:var(--font-medium);background:var(--bg-card-hover);color:var(--text-secondary);border:1px solid var(--border-color);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-normal);align-items:center;gap:var(--space-xs);display:flex}.code-button:hover{background:var(--bg-white);border-color:var(--brand-secondary);color:var(--brand-secondary)}.code-button.copy-btn:hover{border-color:var(--brand-primary);color:var(--brand-primary)}.code-button.deploy-btn{background:var(--color-success-bg);border-color:var(--color-success);color:var(--color-success)}.code-button.deploy-btn:hover{background:var(--color-success);color:var(--brand-white)}.code-button.toggle-btn{background:var(--bg-white);border-color:var(--brand-primary);color:var(--brand-primary)}.code-button.toggle-btn:hover{background:var(--brand-primary);color:var(--text-inverse)}
.card{background:var(--bg-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);padding:var(--space-lg)}.card-bordered{background:var(--bg-card);border:1px solid var(--border-color);border-radius:var(--radius-xl);padding:var(--space-lg);box-shadow:var(--shadow-sm)}.card-hover{transition:all var(--transition-normal)}.card-hover:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.card-header{padding-bottom:var(--space-md);margin-bottom:var(--space-md);border-bottom:1px solid var(--border-light)}.card-body{padding:var(--space-md) 0}.card-footer{padding-top:var(--space-md);margin-top:var(--space-md);border-top:1px solid var(--border-light)}.step-container{background:var(--bg-white);border-radius:var(--radius-xl);padding:var(--space-lg);border:1px solid var(--border-color);margin-bottom:var(--space-lg);box-shadow:var(--shadow-sm)}.step-container:not(.active){display:none}.step-container.active{animation:.3s fadeIn;display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.step-title{margin:0 0 var(--space-lg);padding-bottom:var(--space-md);border-bottom:1px solid var(--border-light);color:var(--text-primary);font-size:var(--text-xl);font-weight:var(--font-semibold);align-items:center;gap:var(--space-sm);display:flex}.step-title i{color:var(--mape-orange);font-size:var(--text-lg)}.preview-container{background:var(--bg-light);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--space-md);margin-top:var(--space-md)}.preview-container h3{margin:0 0 var(--space-md);font-size:var(--text-base);font-weight:var(--font-semibold);color:var(--text-secondary);align-items:center;gap:var(--space-sm);display:flex}.preview-container h3 i{color:var(--mape-blue)}.email-preview{border:1px solid var(--border-color);padding:var(--space-md);background:var(--mape-white);border-radius:var(--radius-md);color:var(--text-primary);max-height:400px;overflow-y:auto}.column{background:var(--bg-white);border-radius:var(--radius-xl);border:1px solid var(--border-color);box-shadow:var(--shadow-sm);flex-direction:column;display:flex;overflow:hidden}.column-header{padding:var(--space-md) var(--space-md);border-bottom:1px solid var(--border-light);font-weight:var(--font-semibold);font-size:var(--text-base);color:var(--text-primary);align-items:center;gap:var(--space-sm);display:flex}.column-header i{color:var(--mape-orange)}.summary-grid{gap:0;display:grid}.summary-item{padding:var(--space-md) 0;border-bottom:1px solid var(--border-light);justify-content:space-between;align-items:center;display:flex}.summary-item:last-child{border-bottom:none}.summary-label{color:var(--text-secondary);font-size:var(--text-base)}.summary-value{color:var(--text-primary);font-weight:var(--font-semibold)}.documentation-section{margin-top:var(--space-lg);padding-top:var(--space-lg);border-top:1px solid var(--border-light)}.documentation-section h4{margin:0 0 var(--space-sm);color:var(--text-primary);font-size:var(--text-base);font-weight:var(--font-semibold);align-items:center;gap:var(--space-sm);display:flex}.documentation-section h4 i{color:var(--mape-blue)}.documentation-section>p{color:var(--text-secondary);font-size:var(--text-sm);margin:0 0 var(--space-md)}
.form-group{margin-bottom:var(--space-md)}.form-group label{margin-bottom:var(--space-sm);font-weight:var(--font-semibold);color:var(--text-primary);font-size:var(--text-base);display:block}.form-input,input[type=text],input[type=email],input[type=password],input[type=number],input[type=date],input[type=time],input[type=url],input[type=tel],input[type=search],textarea,select{width:100%;padding:var(--space-sm) var(--space-md);border:1px solid var(--border-color);border-radius:var(--radius-lg);font-family:var(--font-primary);font-size:var(--text-base);background:var(--bg-white);color:var(--text-primary);transition:all var(--transition-normal)}.form-input::placeholder,input::placeholder,textarea::placeholder{color:var(--text-muted)}.form-input:focus,input:focus,textarea:focus,select:focus{border-color:var(--accent-coral);box-shadow:0 0 0 2px var(--accent-coral-light);outline:none}textarea{resize:vertical;min-height:100px}select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236B7280' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;padding-right:40px}select:hover{border-color:var(--brand-secondary)}select optgroup{font-weight:var(--font-semibold);color:var(--text-primary)}.checkbox-group,.radio-group{gap:var(--space-md);margin-top:var(--space-sm);flex-wrap:wrap;display:flex}.checkbox-group label,.radio-group label{align-items:center;gap:var(--space-sm);cursor:pointer;font-weight:var(--font-regular);color:var(--text-primary);font-size:var(--text-base);display:flex}input[type=checkbox],input[type=radio]{cursor:pointer;appearance:none;border:2px solid var(--border-color);border-radius:var(--radius-sm);background:var(--bg-white);width:18px;height:18px;transition:all var(--transition-fast);position:relative}input[type=radio]{border-radius:50%}input[type=checkbox]:checked,input[type=radio]:checked{background:var(--color-primary);border-color:var(--color-primary)}input[type=checkbox]:checked:after{content:"";border:2px solid #fff;border-width:0 2px 2px 0;width:5px;height:9px;position:absolute;top:2px;left:5px;transform:rotate(45deg)}input[type=radio]:checked:after{content:"";background:#fff;border-radius:50%;width:6px;height:6px;position:absolute;top:4px;left:4px}input[type=checkbox]:hover,input[type=radio]:hover{border-color:var(--color-primary)}input[type=checkbox]:focus,input[type=radio]:focus{box-shadow:0 0 0 3px var(--brand-primary-glow);outline:none}.input-container{padding:var(--space-md);background:var(--bg-white);border-top:1px solid var(--border-light)}.input-form{gap:var(--space-sm);display:flex}.form-input.is-valid,input.is-valid,textarea.is-valid,select.is-valid{border-color:var(--color-success)}.form-input.is-valid:focus,input.is-valid:focus,textarea.is-valid:focus,select.is-valid:focus{box-shadow:0 0 0 3px var(--color-success-bg)}.form-input.is-invalid,input.is-invalid,textarea.is-invalid,select.is-invalid{border-color:var(--color-error)}.form-input.is-invalid:focus,input.is-invalid:focus,textarea.is-invalid:focus,select.is-invalid:focus{box-shadow:0 0 0 3px var(--color-error-bg)}.form-help{margin-top:var(--space-xs);font-size:var(--text-sm);color:var(--text-muted)}.form-error{margin-top:var(--space-xs);font-size:var(--text-sm);color:var(--color-error)}.form-row{gap:var(--space-md);grid-template-columns:repeat(auto-fit,minmax(250px,1fr));display:grid}.form-actions{justify-content:flex-end;gap:var(--space-sm);margin-top:var(--space-lg);padding-top:var(--space-lg);border-top:1px solid var(--border-light);display:flex}.task-selector{align-items:center;gap:var(--space-sm);display:flex}.task-selector label{font-size:var(--text-base);font-weight:var(--font-medium);color:var(--text-secondary)}.task-selector select{padding:var(--space-sm) 36px var(--space-sm) var(--space-md);min-width:220px}.theme-switcher{align-items:center;gap:var(--space-sm);display:flex}.theme-label{font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--text-secondary)}.theme-toggle{background:var(--bg-light);border-radius:var(--radius-lg);border:1px solid var(--border-color);padding:3px;display:flex}.theme-btn{align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-md);cursor:pointer;font-family:var(--font-primary);font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--text-muted);transition:all var(--transition-normal);background:0 0;border:none;display:flex}.theme-btn:hover{color:var(--text-primary);background:var(--bg-card-hover)}.theme-btn.active{background:var(--bg-white);color:var(--text-primary);box-shadow:var(--shadow-sm)}.theme-dot{border-radius:50%;flex-shrink:0;width:12px;height:12px}@media (max-width:768px){.theme-switcher{order:-1;justify-content:center;width:100%}.theme-label{display:none}}
.demo-banner{background:var(--brand-dark);color:var(--text-inverse);text-align:center;padding:var(--space-sm) var(--space-md);font-size:var(--text-sm);font-weight:var(--font-medium);justify-content:center;align-items:center;gap:var(--space-sm);display:flex}.demo-banner a{color:var(--text-inverse);opacity:.9;text-decoration:underline}.demo-banner a:hover{opacity:1}.header{background:var(--bg-white);padding:var(--space-md) var(--space-xl);border-bottom:1px solid var(--border-color);min-height:72px;transition:all var(--transition-base);justify-content:space-between;align-items:center;display:flex}.header-premium{background:var(--brand-dark);color:var(--text-inverse);border-radius:var(--radius-xl);margin:var(--space-md);padding:var(--space-md) var(--space-2xl);border:none}.header-brand{align-items:center;display:flex}.header-logo{width:auto;height:48px}.header-logo-lg{height:64px}.logo-slate{display:block}.logo-mape,[data-theme=mape] .logo-slate{display:none}[data-theme=mape] .logo-mape{display:block}.header-title{font-size:var(--text-2xl);font-weight:var(--font-bold);color:var(--text-primary);align-items:baseline;margin:0;display:flex}.header-title .dot{color:var(--brand-primary);margin-left:2px}.header-subtitle{font-size:var(--text-sm);color:var(--text-secondary);margin:0}.header-tagline{flex-direction:column;align-items:flex-end;display:flex}.header-tagline span{font-size:var(--text-sm);color:var(--text-muted)}.header-tagline strong{color:var(--brand-secondary);font-weight:var(--font-semibold)}.header-controls{align-items:center;gap:var(--space-md);display:flex}.header-left,.header-right{align-items:center;display:flex}.wizard-nav{margin-bottom:var(--space-lg);margin-top:var(--space-lg);background:var(--bg-white);border-radius:var(--radius-xl);padding:var(--space-lg) var(--space-xs) var(--space-xs) var(--space-xs);box-shadow:none;justify-content:space-between;gap:var(--space-xs);border:none;display:flex}.nav-step{text-align:center;padding:var(--space-md) var(--space-sm);border-radius:var(--radius-lg);cursor:pointer;opacity:.5;font-size:var(--text-sm);font-weight:var(--font-medium);align-items:center;gap:var(--space-xs);color:var(--text-secondary);flex-direction:column;flex:1;transition:all .25s;display:flex}.nav-step i{font-size:var(--text-xl)}.nav-step.active{background:var(--accent-coral);opacity:1;color:var(--text-inverse);box-shadow:var(--shadow-coral)}.nav-step.completed{opacity:.85;color:var(--color-success)}.nav-step.active.completed{color:var(--text-inverse)}.nav-step.completed i:after{content:"✓";margin-left:var(--space-xs);font-family:inherit;font-style:normal;font-size:var(--text-xs)}.nav-step:hover:not(.active){opacity:.75;background:var(--bg-card-hover)}.footer{text-align:center;padding:var(--space-lg);color:var(--text-muted);font-size:var(--text-sm)}.footer a{color:var(--brand-primary);text-decoration:none}.footer a:hover{text-decoration:underline}.footer-heart{vertical-align:middle;width:auto;height:16px;margin:0 2px}.heart-slate{display:inline}.heart-mape,[data-theme=mape] .heart-slate{display:none}[data-theme=mape] .heart-mape{display:inline}.footer-fixed{background:var(--bg-light);position:fixed;bottom:0;left:0;right:0}.app-container{max-width:var(--container-lg);padding:var(--space-lg) var(--space-md) var(--space-2xl);margin:0 auto}.main-container{gap:var(--space-md);max-width:var(--container-2xl);padding:var(--space-md);grid-template-columns:1fr 1fr;height:calc(100vh - 140px);margin:0 auto;display:grid}@media (max-width:1024px){.main-container{grid-template-columns:1fr;height:auto}.header{gap:var(--space-sm);padding:var(--space-md);flex-direction:column}.header-controls{justify-content:center;width:100%}}@media (max-width:768px){.header{gap:var(--space-sm);text-align:center;flex-direction:column}.header-tagline{align-items:center}.wizard-nav{flex-wrap:wrap}.nav-step{font-size:var(--text-xs);padding:var(--space-sm);flex:30%}.nav-step span{display:none}}
.status-badge{align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-md);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--font-semibold);display:inline-flex}.status-success{background:var(--color-success-bg);color:var(--color-success)}.status-pending,.status-warning{background:var(--color-warning-bg);color:var(--color-warning)}.status-error{background:var(--color-error-bg);color:var(--color-error)}.status-info{background:var(--color-info-bg);color:var(--color-info)}.status-message{padding:var(--space-md);border-radius:var(--radius-lg);margin:var(--space-md) 0;align-items:center;gap:var(--space-sm);font-size:var(--text-base);font-weight:var(--font-medium);display:flex}.status-message.status-success{background:var(--color-success-bg);color:var(--color-success)}.status-message.status-error{background:var(--color-error-bg);color:var(--color-error)}.status-message.status-warning{background:var(--color-warning-bg);color:var(--color-warning)}.status-message.status-info{background:var(--color-info-bg);color:var(--color-info)}.alert{padding:var(--space-md);border-radius:var(--radius-md);margin-bottom:var(--space-md)}.alert-success{color:#166534;background:#dcfce7}.alert-error{color:#991b1b;background:#fee2e2}.alert-warning{color:#92400e;background:#fef3c7}.alert-info{background:var(--mape-blue-glow);color:#0369a1}.connection-status{font-size:var(--text-sm);align-items:center;gap:var(--space-xs);display:flex}.status-connected{color:var(--color-success)}.status-disconnected{color:var(--color-error)}.status-pending{color:var(--brand-accent)}.doc-status-grid{gap:var(--space-sm);margin-top:var(--space-md);display:grid}.doc-status-item{align-items:center;gap:var(--space-sm);font-size:var(--text-sm);display:flex}.doc-status-label{min-width:120px;color:var(--text-secondary)}.result-item{align-items:center;gap:var(--space-md);padding:var(--space-md);background:var(--bg-light);border-radius:var(--radius-md);margin-bottom:var(--space-sm);display:flex}.result-icon{width:24px;height:24px;font-size:var(--text-base);border-radius:50%;justify-content:center;align-items:center;display:flex}.result-icon.success{color:var(--color-success);background:#dcfce7}.result-icon.error{color:var(--color-error);background:#fee2e2}.result-name{font-weight:var(--font-medium)}.result-detail{font-size:var(--text-sm);color:var(--text-muted);margin-left:auto}.empty-state{height:100%;color:var(--text-muted);text-align:center;padding:var(--space-2xl);flex-direction:column;justify-content:center;align-items:center;display:flex}.empty-state i{margin-bottom:var(--space-md);opacity:.3;color:var(--brand-secondary);font-size:64px}.empty-state h3{margin:0 0 var(--space-sm);font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--text-secondary)}.empty-state p{font-size:var(--text-base);margin:0}
.loading-container{padding:var(--space-xl);justify-content:center;align-items:center;display:flex}.loading-message{align-items:center;gap:var(--space-md);color:var(--text-secondary);font-size:var(--text-base);font-weight:var(--font-medium);display:flex}.loading-drops{gap:var(--space-sm);display:flex}.loading-drop{border-radius:50%/60% 60% 40% 40%;width:12px;height:14px;animation:1.4s ease-in-out infinite dropPulse}.loading-drop:first-child{background:var(--brand-primary)}.loading-drop:nth-child(2){background:var(--brand-secondary);animation-delay:.2s}.loading-drop:nth-child(3){background:var(--accent-coral);animation-delay:.4s}@keyframes dropPulse{0%,to{opacity:.4;transform:scale(.8)translateY(0)}50%{opacity:1;transform:scale(1.1)translateY(-4px)}}.loading-drops.loading-lg .loading-drop{width:16px;height:20px}.code-loading{justify-content:center;align-items:center;gap:var(--space-md);flex-direction:column;height:100%;display:flex}.spinner{border:4px solid var(--border-color);border-top-color:var(--accent-coral);border-radius:50%;width:48px;height:48px;animation:1s linear infinite spin}.spinner-sm{border-width:2px;width:24px;height:24px}.spinner-lg{border-width:6px;width:64px;height:64px}@keyframes spin{to{transform:rotate(360deg)}}.loading-overlay{z-index:var(--z-modal);background:#ffffffe6;flex-direction:column;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.loading-text{margin-top:var(--space-md);font-weight:var(--font-medium);color:var(--text-muted)}.skeleton,.skeleton-line{background:linear-gradient(90deg, var(--bg-light) 25%, var(--bg-card-hover) 50%, var(--bg-light) 75%);border-radius:var(--radius-md);background-size:200% 100%;animation:1.5s infinite skeleton-loading}[data-mode=dark] .skeleton,[data-mode=dark] .skeleton-line{background:linear-gradient(90deg,#3e415a 25%,#4a4f66 50%,#3e415a 75%)}.skeleton-line{width:100%;height:12px;display:block}.skeleton-text{height:1em;margin-bottom:var(--space-sm)}.skeleton-title{width:60%;height:1.5em;margin-bottom:var(--space-md)}.skeleton-avatar{border-radius:50%;width:48px;height:48px}.skeleton-button{width:120px;height:40px}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.progress{background:var(--bg-light);border-radius:var(--radius-full);width:100%;height:8px;overflow:hidden}.progress-bar{background:linear-gradient(135deg, var(--brand-primary) 0%, var(--brand-secondary) 100%);border-radius:var(--radius-full);height:100%;transition:width var(--transition-slow)}.progress-bar-animated{background:linear-gradient(135deg, var(--brand-primary) 0%, var(--brand-secondary) 50%, var(--brand-primary) 100%);background-size:200% 100%;animation:2s linear infinite progress-animation}@keyframes progress-animation{0%{background-position:100% 0}to{background-position:-100% 0}}.loading-logo{justify-content:center;align-items:center;gap:var(--space-lg);flex-direction:column;display:flex}.mape-icon-pulse{background-image:url(/logos/mape-icon.svg);background-position:50%;background-repeat:no-repeat;background-size:contain;width:64px;height:64px;animation:2s ease-in-out infinite mape-pulse}.mape-icon-unfold{background-image:url(/logos/mape-icon.svg);background-position:50%;background-repeat:no-repeat;background-size:contain;width:72px;height:72px;animation:1.6s cubic-bezier(.22,1,.36,1) forwards mape-unfold}@keyframes mape-pulse{0%,to{opacity:.4;transform:scale(.95)}50%{opacity:1;transform:scale(1.05)}}@keyframes mape-unfold{0%{clip-path:circle(16px);opacity:.3;transform:scale(.5)}60%{clip-path:circle(48px);opacity:1;transform:scale(1.05)}80%{clip-path:none;opacity:1;transform:scale(.98)}to{clip-path:none;opacity:1;transform:scale(1)}}.mape-icon-pulse.loading-sm,.mape-icon-unfold.loading-sm{width:32px;height:32px}.mape-icon-pulse.loading-lg,.mape-icon-unfold.loading-lg{width:120px;height:120px}
.d-none{display:none!important}.d-block{display:block!important}.d-flex{display:flex!important}.d-inline{display:inline!important}.d-inline-flex{display:inline-flex!important}.d-grid{display:grid!important}.flex-row{flex-direction:row}.flex-column{flex-direction:column}.flex-wrap{flex-wrap:wrap}.flex-nowrap{flex-wrap:nowrap}.flex-1{flex:1}.flex-grow-0{flex-grow:0}.flex-grow-1{flex-grow:1}.flex-shrink-0{flex-shrink:0}.justify-start{justify-content:flex-start}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-between{justify-content:space-between}.justify-around{justify-content:space-around}.align-start{align-items:flex-start}.align-center{align-items:center}.align-end{align-items:flex-end}.align-stretch{align-items:stretch}.gap-0{gap:0}.gap-xs{gap:var(--space-xs)}.gap-sm{gap:var(--space-sm)}.gap-md{gap:var(--space-md)}.gap-lg{gap:var(--space-lg)}.gap-xl{gap:var(--space-xl)}.m-0{margin:0}.m-auto{margin:auto}.mx-auto{margin-left:auto;margin-right:auto}.mt-0{margin-top:0}.mt-sm{margin-top:var(--space-sm)}.mt-md{margin-top:var(--space-md)}.mt-lg{margin-top:var(--space-lg)}.mt-xl{margin-top:var(--space-xl)}.mb-0{margin-bottom:0}.mb-sm{margin-bottom:var(--space-sm)}.mb-md{margin-bottom:var(--space-md)}.mb-lg{margin-bottom:var(--space-lg)}.mb-xl{margin-bottom:var(--space-xl)}.ml-auto{margin-left:auto}.mr-auto{margin-right:auto}.p-0{padding:0}.p-sm{padding:var(--space-sm)}.p-md{padding:var(--space-md)}.p-lg{padding:var(--space-lg)}.p-xl{padding:var(--space-xl)}.px-sm{padding-left:var(--space-sm);padding-right:var(--space-sm)}.px-md{padding-left:var(--space-md);padding-right:var(--space-md)}.px-lg{padding-left:var(--space-lg);padding-right:var(--space-lg)}.py-sm{padding-top:var(--space-sm);padding-bottom:var(--space-sm)}.py-md{padding-top:var(--space-md);padding-bottom:var(--space-md)}.py-lg{padding-top:var(--space-lg);padding-bottom:var(--space-lg)}.text-left{text-align:left}.text-center{text-align:center}.text-right{text-align:right}.text-primary{color:var(--text-primary)}.text-secondary{color:var(--text-secondary)}.text-muted{color:var(--text-muted)}.text-orange{color:var(--mape-orange)}.text-blue{color:var(--mape-blue)}.text-success{color:var(--color-success)}.text-error{color:var(--color-error)}.text-warning{color:var(--color-warning)}.text-white{color:var(--mape-white)}.font-light{font-weight:var(--font-light)}.font-normal{font-weight:var(--font-regular)}.font-medium{font-weight:var(--font-medium)}.font-semibold{font-weight:var(--font-semibold)}.font-bold{font-weight:var(--font-bold)}.text-xs{font-size:var(--text-xs)}.text-sm{font-size:var(--text-sm)}.text-base{font-size:var(--text-base)}.text-lg{font-size:var(--text-lg)}.text-xl{font-size:var(--text-xl)}.text-2xl{font-size:var(--text-2xl)}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.bg-white{background-color:var(--bg-white)}.bg-light{background-color:var(--bg-light)}.bg-dark{background-color:var(--bg-dark)}.bg-orange{background-color:var(--mape-orange)}.bg-blue{background-color:var(--mape-blue)}.bg-transparent{background-color:#0000}.border{border:1px solid var(--border-color)}.border-0{border:none}.border-top{border-top:1px solid var(--border-color)}.border-bottom{border-bottom:1px solid var(--border-color)}.border-light{border-color:var(--border-light)}.rounded{border-radius:var(--radius-md)}.rounded-sm{border-radius:var(--radius-sm)}.rounded-lg{border-radius:var(--radius-lg)}.rounded-xl{border-radius:var(--radius-xl)}.rounded-full{border-radius:var(--radius-full)}.shadow-none{box-shadow:none}.shadow-sm{box-shadow:var(--shadow-sm)}.shadow-md{box-shadow:var(--shadow-md)}.shadow-lg{box-shadow:var(--shadow-lg)}.shadow-orange{box-shadow:var(--shadow-orange)}.w-full{width:100%}.w-auto{width:auto}.h-full{height:100%}.h-screen{height:100vh}.min-h-screen{min-height:100vh}.overflow-hidden{overflow:hidden}.overflow-auto{overflow:auto}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.relative{position:relative}.absolute{position:absolute}.fixed{position:fixed}.sticky{position:sticky}.cursor-pointer{cursor:pointer}.cursor-default{cursor:default}.cursor-not-allowed{cursor:not-allowed}.visible{visibility:visible}.invisible{visibility:hidden}.opacity-0{opacity:0}.opacity-50{opacity:.5}.opacity-100{opacity:1}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.chat-column{background:var(--bg-white);border-radius:var(--radius-xl);border:1px solid var(--border-color);box-shadow:var(--shadow-sm);flex-direction:column;display:flex;overflow:hidden}.chat-history{padding:var(--space-md);background:var(--bg-light);flex-grow:1;overflow-y:auto}.message{margin-bottom:var(--space-md);padding:var(--space-md);border-radius:var(--radius-lg);max-width:85%;font-size:var(--text-base);line-height:var(--leading-relaxed);animation:.3s messageSlide}@keyframes messageSlide{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.user-message{background:linear-gradient(135deg, var(--mape-orange) 0%, var(--mape-peach) 100%);color:var(--mape-white);border-bottom-right-radius:var(--radius-sm);margin-left:auto}.bot-message{background:var(--bg-white);color:var(--text-primary);border:1px solid var(--border-color);border-bottom-left-radius:var(--radius-sm);margin-right:auto}.code-column{background:var(--bg-white);border-radius:var(--radius-xl);border:1px solid var(--border-color);box-shadow:var(--shadow-sm);flex-direction:column;display:flex;overflow:hidden}.code-header{padding:var(--space-md);border-bottom:1px solid var(--border-light);justify-content:space-between;align-items:center;display:flex}.code-header-title{font-weight:var(--font-semibold);font-size:var(--text-base);color:var(--text-primary);align-items:center;gap:var(--space-sm);display:flex}.code-header-title i{color:var(--mape-blue)}.code-header-buttons{gap:var(--space-sm);display:flex}.code-output{padding:var(--space-md);background:var(--bg-light);flex-grow:1;overflow-y:auto}.btn-container{margin-top:var(--space-lg);justify-content:space-between;gap:var(--space-sm);display:flex}@media (max-width:768px){.btn-container{flex-wrap:wrap}.btn-container .btn{padding:var(--space-sm) var(--space-md);flex:1;justify-content:center}}