*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f5f5}.app-container{height:100vh;display:flex;flex-direction:column;background-color:#fff}.app-header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:1rem 2rem;box-shadow:0 2px 4px #0000001a;z-index:10}.app-header h1{font-size:1.5rem;font-weight:600}.main-content{display:flex;flex:1;overflow:hidden}.sidebar{width:350px;background-color:#fafafa;border-right:1px solid #e1e5e9;display:flex;flex-direction:column;overflow:hidden}.sidebar-header{padding:1rem;border-bottom:1px solid #e1e5e9;background-color:#fff;display:flex;justify-content:space-between;align-items:center}.sidebar-header h2{font-size:1.125rem;font-weight:600;color:#374151}.refresh-btn{background:none;border:1px solid #d1d5db;padding:.5rem;border-radius:6px;cursor:pointer;font-size:1rem;color:#6b7280;transition:all .2s;width:36px;height:36px;display:flex;align-items:center;justify-content:center}.refresh-btn:hover:not(:disabled){background-color:#f3f4f6;color:#374151}.refresh-btn:disabled{opacity:.5;cursor:not-allowed}.automations-list{flex:1;overflow-y:auto;padding:.5rem}.automation-item{padding:.75rem;margin-bottom:.5rem;background-color:#fff;border:1px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .2s}.automation-item:hover{background-color:#f9fafb;border-color:#d1d5db;transform:translateY(-1px);box-shadow:0 2px 4px #0000000d}.automation-item.selected{background-color:#eff6ff;border-color:#3b82f6;box-shadow:0 0 0 1px #3b82f6}.automation-name{font-weight:600;color:#1f2937;margin-bottom:.25rem;font-size:.875rem}.automation-status{display:inline-block;padding:.125rem .5rem;border-radius:12px;font-size:.75rem;font-weight:500;margin-bottom:.25rem;text-transform:uppercase}.status-active,.status-running{background-color:#dcfce7;color:#166534}.status-inactive,.status-stopped{background-color:#fef2f2;color:#991b1b}.status-scheduled,.status-pending{background-color:#fef3c7;color:#92400e}.automation-description{color:#6b7280;font-size:.75rem;line-height:1.4;margin-top:.25rem}.detail-view{flex:1;background-color:#fff;overflow-y:auto;display:flex;flex-direction:column}.welcome-message{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;text-align:center;padding:2rem;color:#6b7280}.welcome-message h3{color:#374151;margin-bottom:.5rem}.automation-details{padding:2rem;max-width:800px;margin:0 auto;width:100%}.detail-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:2rem;padding-bottom:1rem;border-bottom:1px solid #e5e7eb}.detail-header h2{color:#1f2937;font-size:1.5rem;font-weight:700}.status-badge{padding:.25rem .75rem;border-radius:16px;font-size:.75rem;font-weight:600;text-transform:uppercase}.detail-section{margin-bottom:2rem}.detail-section h3{color:#374151;font-size:1.125rem;font-weight:600;margin-bottom:1rem}.detail-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1rem}.detail-item{display:flex;flex-direction:column;gap:.25rem}.detail-item label{font-weight:600;color:#374151;font-size:.875rem}.detail-item span{color:#6b7280;font-size:.875rem;padding:.5rem;background-color:#f9fafb;border-radius:6px;border:1px solid #e5e7eb}.recurrence-rule{font-family:Monaco,Menlo,Ubuntu Mono,monospace!important;font-size:.75rem!important;word-break:break-all;white-space:pre-wrap}.json-response{background-color:#1f2937;color:#f9fafb;padding:1rem;border-radius:8px;overflow-x:auto;font-size:.75rem;line-height:1.5;font-family:Monaco,Menlo,Ubuntu Mono,monospace;border:1px solid #374151}.loading{display:flex;align-items:center;justify-content:center;padding:2rem;color:#6b7280;font-style:italic}.empty-state{display:flex;align-items:center;justify-content:center;padding:2rem;color:#9ca3af;font-style:italic;text-align:center}.error-message{background-color:#fef2f2;border:1px solid #fecaca;color:#991b1b;padding:1rem;border-radius:8px;margin:1rem}.error-message p{margin-bottom:.5rem}.retry-btn{background-color:#ef4444;color:#fff;border:none;padding:.5rem 1rem;border-radius:6px;cursor:pointer;font-size:.875rem;font-weight:500;transition:background-color .2s}.retry-btn:hover{background-color:#dc2626}.flow-chart{padding:1rem;background-color:#f8fafc;border-radius:8px;border:1px solid #e2e8f0}.flow-step{margin-bottom:2rem;position:relative}.step-header{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff;padding:1rem;border-radius:8px 8px 0 0;margin-bottom:0}.step-number{font-size:1.125rem;font-weight:700;margin-bottom:.25rem}.step-name{font-size:1rem;font-weight:600;margin-bottom:.25rem}.step-description{font-size:.875rem;opacity:.9}.activities-container{background-color:#fff;border:1px solid #e2e8f0;border-top:none;border-radius:0 0 8px 8px;padding:1rem}.activity-box{background-color:#f1f5f9;border:1px solid #cbd5e1;border-radius:6px;padding:1rem;margin-bottom:1rem}.activity-box:last-child{margin-bottom:0}.activity-header{margin-bottom:.75rem}.activity-name{font-weight:600;color:#1e293b;font-size:1rem;margin-bottom:.25rem}.activity-type{font-size:.75rem;color:#64748b;background-color:#e2e8f0;padding:.125rem .5rem;border-radius:12px;display:inline-block}.target-data-extensions{margin-top:.75rem}.target-header{font-size:.875rem;font-weight:600;color:#374151;margin-bottom:.5rem}.data-extension{background-color:#fff;border:1px solid #d1d5db;border-radius:4px;padding:.75rem;margin-bottom:.5rem;box-shadow:0 1px 2px #0000000d}.data-extension:last-child{margin-bottom:0}.data-ext-name{font-weight:600;color:#1f2937;font-size:.875rem;margin-bottom:.25rem}.data-ext-count{font-size:.75rem;color:#059669;background-color:#d1fae5;padding:.125rem .5rem;border-radius:12px;display:inline-block;font-weight:500;margin-bottom:.25rem}.data-ext-description{font-size:.75rem;color:#6b7280;line-height:1.4}.flow-arrow{display:flex;flex-direction:column;align-items:center;margin:1rem 0}.arrow-line{width:2px;height:20px;background:linear-gradient(to bottom,#9ca3af,#6b7280);margin-bottom:2px}.arrow-head{font-size:1.5rem;color:#6b7280;font-weight:700;text-shadow:0 1px 2px rgba(0,0,0,.1)}@media (max-width: 768px){.main-content{flex-direction:column}.sidebar{width:100%;height:40vh;border-right:none;border-bottom:1px solid #e1e5e9}.detail-view{height:60vh}.automation-details{padding:1rem}.detail-header{flex-direction:column;align-items:flex-start;gap:1rem}.detail-grid{grid-template-columns:1fr}}@media (max-width: 480px){.app-header{padding:1rem}.app-header h1{font-size:1.25rem}.sidebar,.detail-view{height:50vh}}@media (max-width: 768px){.flow-chart{padding:.5rem}.step-header,.activities-container,.activity-box{padding:.75rem}.data-extension{padding:.5rem}}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}*{box-sizing:border-box}html,body,#root{height:100%}