:root{--color-text: #f1f5f9;--color-text-secondary: #94a3b8;--color-text-muted: #6b7280;--color-background: #111827;--color-surface: rgba(15, 23, 42, .75);--color-surface-elevated: rgba(30, 41, 59, .8);--color-surface-hover: rgba(75, 85, 99, .4);--color-border: rgba(55, 65, 81, .5);--color-border-light: rgba(55, 65, 81, .3);--color-border-strong: rgba(55, 65, 81, .7);--color-primary: #3b82f6;--color-primary-dark: #2563eb;--color-primary-darker: #1d4ed8;--color-primary-light: #93c5fd;--color-primary-alpha-10: rgba(59, 130, 246, .1);--color-primary-alpha-30: rgba(59, 130, 246, .3);--color-success: #10b981;--color-success-dark: #059669;--color-success-darker: #047857;--color-success-alpha-10: rgba(16, 185, 129, .1);--color-success-alpha-15: rgba(16, 185, 129, .15);--color-success-alpha-30: rgba(16, 185, 129, .3);--color-success-alpha-40: rgba(16, 185, 129, .4);--color-warning: #f59e0b;--color-warning-dark: #d97706;--color-warning-darker: #b45309;--color-warning-light: #fbbf24;--color-warning-alpha-10: rgba(245, 158, 11, .1);--color-warning-alpha-15: rgba(245, 158, 11, .15);--color-warning-alpha-30: rgba(245, 158, 11, .3);--color-warning-alpha-40: rgba(245, 158, 11, .4);--color-error: #ef4444;--color-error-dark: #dc2626;--color-error-darker: #b91c1c;--color-error-light: #fca5a5;--color-error-alpha-10: rgba(239, 68, 68, .1);--color-error-alpha-30: rgba(239, 68, 68, .3);--color-info: #06b6d4;--color-info-dark: #0891b2;--color-info-darker: #0e7490;--color-gray-50: #f9fafb;--color-gray-100: #f3f4f6;--color-gray-200: #e5e7eb;--color-gray-300: #d1d5db;--color-gray-400: #9ca3af;--color-gray-500: #6b7280;--color-gray-600: #4b5563;--color-gray-700: #374151;--color-gray-800: #1f2937;--color-gray-900: #111827;--color-gray-alpha-20: rgba(107, 114, 128, .2);--color-gray-alpha-30: rgba(107, 114, 128, .3);--color-gray-alpha-50: rgba(107, 114, 128, .5);--color-gray-alpha-60: rgba(107, 114, 128, .6);--color-gray-alpha-80: rgba(107, 114, 128, .8);--color-purple: #8b5cf6;--color-purple-dark: #7c3aed;--color-purple-darker: #6d28d9;--color-purple-darkest: #5b21b6;--color-purple-alpha-10: rgba(139, 92, 246, .1);--color-purple-alpha-30: rgba(139, 92, 246, .3);--color-pink: #ec4899;--color-pink-dark: #f43f5e;--color-teal: #14b8a6;--color-teal-dark: #0d9488;--color-slate-500: #64748b;--color-slate-600: #475569;--color-slate-700: #334155;--color-orange: #ea580c;--color-indigo: #4f46e5;--color-slate-400: #94a3b8;--color-indigo-400: #818cf8;--color-success-darkest: #065f46;--color-success-light: #d1fae5;--color-error-darkest: #7f1d1d;--color-error-lightest: #fecaca;--color-warning-darkest: #92400e;--color-warning-lightest: #fde68a;--color-blue-600: #1e40af;--color-blue-200: #dbeafe;--color-blue-400: #60a5fa;--color-logs-bg: #0f1419;--color-warning-bg-dark: #451a03;--color-red-400: #f87171;--color-yellow-400: #facc15;--color-green-400: #4ade80;--color-gray-200-light: #e5e7eb;--color-gray-neutral: #a3a3a3;--color-error-bg-light: #fef2f2;--color-success-bg-darkest: #064e3b;--shadow-sm: 0 4px 12px rgba(0, 0, 0, .15);--shadow-md: 0 4px 20px rgba(0, 0, 0, .15);--shadow-lg: 0 10px 25px rgba(0, 0, 0, .25);--shadow-primary: 0 0 15px rgba(59, 130, 246, .5);--shadow-success: 0 4px 12px rgba(16, 185, 129, .3);--shadow-error: 0 4px 12px rgba(239, 68, 68, .3);--shadow-warning: 0 4px 12px rgba(245, 158, 11, .3);--shadow-info: 0 4px 12px rgba(6, 182, 212, .3);--shadow-purple: 0 4px 12px rgba(139, 92, 246, .3);--shadow-slate: 0 4px 12px rgba(100, 116, 139, .3)}body{background-color:var(--color-background);color:var(--color-text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;margin:0;padding:0;overflow-x:hidden;box-sizing:border-box;width:100%}*,*:before,*:after{box-sizing:border-box}.app-container{min-height:100vh;background-color:var(--color-background);display:flex;flex-direction:column;overflow-x:hidden}.container{width:100%;max-width:1500px;margin:0 auto;padding:0 16px;box-sizing:border-box}.header{background-color:var(--color-surface);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--color-border);position:sticky;top:0;z-index:50;padding:12px 0}.header-content{display:flex;align-items:center;justify-content:space-between}.logo-container{display:flex;align-items:center;gap:12px}.logo{background:linear-gradient(to bottom right,var(--color-primary),var(--color-indigo));width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-primary)}.logo-text{font-size:1.25rem;font-weight:700}.logo-text span{color:var(--color-primary)}.header-actions{display:flex;align-items:center;gap:12px;flex-shrink:0;min-width:0}.status-bar{display:none;align-items:center;gap:8px;background-color:var(--color-border-strong);padding:6px 12px;border-radius:8px;border:1px solid var(--color-border);font-size:.75rem;color:var(--color-text-secondary)}@media (min-width: 768px){.status-bar{display:flex}}.status-separator{width:1px;height:12px;background-color:var(--color-border)}.status-indicator{display:flex;align-items:center}.status-dot{width:6px;height:6px;border-radius:50%;margin-right:6px}.dot-green{background-color:var(--color-success);animation:pulse 1s infinite}.dot-gray{background-color:var(--color-gray-600)}.dot-red{background-color:var(--color-error)}.button{display:flex;align-items:center;justify-content:center;padding:6px 12px;border-radius:8px;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s;border:none;gap:8px}.button-primary{background:linear-gradient(to right,var(--color-primary),var(--color-primary-dark));color:#fff}.button-primary:hover{background:linear-gradient(to right,var(--color-primary-dark),var(--color-primary-darker));transform:translateY(-2px)}.button-secondary{background:linear-gradient(to right,var(--color-error),var(--color-error-dark));color:#fff}.button-secondary:hover{background:linear-gradient(to right,var(--color-error-dark),var(--color-error-darker));transform:translateY(-2px)}.button-warning{background:linear-gradient(to right,var(--color-warning),var(--color-warning-dark));color:#fff}.button-warning:hover{background:linear-gradient(to right,var(--color-warning-dark),var(--color-warning-darker));transform:translateY(-2px)}.button:disabled{opacity:.5;cursor:not-allowed;transform:none}.stuck-container-warning{margin:12px 16px;background:linear-gradient(135deg,var(--color-warning-alpha-10),var(--color-warning-alpha-10));border:1px solid var(--color-warning-alpha-30);border-radius:12px;padding:16px;animation:fadeIn .3s ease-out}.warning-content{display:flex;align-items:flex-start;gap:12px}.warning-icon{color:var(--color-warning);flex-shrink:0;margin-top:2px}.warning-message{flex:1;min-width:0}.warning-message strong{display:block;color:var(--color-warning);font-weight:600;margin-bottom:4px;font-size:.9rem}.warning-message p{margin:0;color:var(--color-text);font-size:.85rem;line-height:1.4;opacity:.9}.warning-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}.restart-button{display:flex;align-items:center;gap:6px;font-size:.8rem;padding:8px 12px;border-radius:8px;font-weight:500;white-space:nowrap}.restart-button:disabled{opacity:.7;cursor:not-allowed}.dismiss-button{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:6px;background:var(--color-gray-alpha-20);border:1px solid var(--color-gray-alpha-30);color:var(--color-text);cursor:pointer;transition:all .2s}.dismiss-button:hover{background:var(--color-gray-alpha-30);border-color:var(--color-gray-alpha-50)}@media (max-width: 640px){.warning-content{flex-direction:column;gap:8px}.warning-actions{align-self:stretch;justify-content:space-between}.restart-button{flex:1;justify-content:center}}.main-content{padding:20px 0;flex:1;overflow-x:hidden}.loading-container{display:flex;align-items:center;justify-content:center;min-height:400px}.loading-content{text-align:center}.loading-spinner-container{margin-bottom:16px;position:relative}.loading-spinner{position:relative;width:48px;height:48px;border-radius:50%;background:linear-gradient(45deg,var(--color-primary),transparent);animation:pulse-ring 1.2s cubic-bezier(.4,0,.6,1) infinite}.loading-spinner:before{content:"";position:absolute;top:50%;left:50%;width:32px;height:32px;border-radius:50%;background:linear-gradient(45deg,var(--color-primary-dark),var(--color-primary));transform:translate(-50%,-50%);animation:pulse-ring 1.2s cubic-bezier(.4,0,.6,1) infinite reverse}.loading-spinner:after{content:"";position:absolute;top:50%;left:50%;width:16px;height:16px;border-radius:50%;background:var(--color-text);transform:translate(-50%,-50%);animation:pulse .8s cubic-bezier(.4,0,.6,1) infinite}@keyframes pulse-ring{0%{opacity:1;transform:scale(.9)}50%{opacity:.7;transform:scale(1.05)}to{opacity:1;transform:scale(.9)}}.loading-text{font-size:1.125rem;font-weight:600;margin-bottom:8px}.loading-subtext{color:var(--color-text-secondary);font-size:.875rem}.error-alert{background-color:var(--color-error-alpha-10);border:1px solid var(--color-error-alpha-30);border-radius:8px;padding:16px;margin-bottom:24px}.error-content{display:flex;align-items:flex-start;gap:12px}.error-title{font-weight:600;color:var(--color-error);margin-bottom:4px}.error-message{color:var(--color-error-light);font-size:.875rem}.error-close{background:none;border:none;color:var(--color-error);cursor:pointer;padding:4px;border-radius:4px;margin-left:auto;flex-shrink:0}.error-close:hover{background-color:var(--color-error-alpha-10)}.close-icon{width:16px;height:16px}.empty-state-container{display:flex;align-items:center;justify-content:center;min-height:400px}.empty-state-content{text-align:center;max-width:400px}.empty-state-icon{color:var(--color-gray-500);margin-bottom:16px}.empty-state-title{font-size:1.25rem;font-weight:600;margin-bottom:8px}.empty-state-description{color:var(--color-text-secondary);margin-bottom:24px}.services-container{overflow-x:hidden;width:100%}.services-loading{opacity:.7}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spin{border:2px solid transparent;border-top:2px solid currentColor;border-radius:50%;animation:spin .8s linear infinite}.action-icon.spin{width:10px;height:10px;border-width:1px}.button-icon.spin,.status-icon.spin{width:16px;height:16px}.card{background-color:var(--color-surface);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--color-border);border-radius:12px;box-shadow:var(--shadow-md);margin-bottom:24px;overflow:hidden;transition:all .3s ease-in-out}.card-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--color-border)}.card-title{display:flex;align-items:center;gap:12px;font-size:1.25rem;font-weight:700}.loading-indicator{display:flex;align-items:center;margin-left:auto;color:var(--color-primary)}.card-icon{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:8px}.card-body{padding:16px 20px;transition:all .3s ease-in-out}.services-grid{display:grid;grid-template-columns:1fr;gap:12px;position:relative;z-index:0;transition:all .3s ease-in-out;width:100%;overflow-x:visible}@media (min-width: 612px){.services-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width: 904px){.services-grid{grid-template-columns:repeat(3,1fr)}}@media (min-width: 1196px){.services-grid{grid-template-columns:repeat(4,1fr)}}@media (min-width: 1488px){.services-grid{grid-template-columns:repeat(5,1fr)}}.services-list{display:flex;flex-direction:column;gap:8px}.service-item{background-color:var(--color-surface-elevated);border-radius:8px;border:1px solid var(--color-border);position:relative;overflow:hidden;transition:all .3s ease-in-out;will-change:transform,opacity;z-index:1;min-height:140px;min-width:280px;max-width:100%;box-sizing:border-box}.service-item:hover{background-color:var(--color-surface-hover);transform:translateY(-2px);box-shadow:var(--shadow-sm)}.service-item-running{background-color:var(--color-success-alpha-10);border-color:var(--color-success-alpha-30)}.service-item-starting{background-color:var(--color-primary-alpha-10);border-color:var(--color-primary-alpha-30)}.service-item-error{background-color:var(--color-error-alpha-10);border-color:var(--color-error-alpha-30)}.service-item-stopped{background-color:var(--color-surface-elevated);border-color:var(--color-border)}.service-item-running-healthy{background-color:var(--color-success-alpha-15);border-color:var(--color-success-alpha-40)}.service-item-running-unhealthy{background-color:var(--color-warning-alpha-15);border-color:var(--color-warning-alpha-40)}.service-item-running-health-starting{background-color:var(--color-primary-alpha-10);border-color:var(--color-primary-alpha-30);animation:health-check-border-pulse 2s ease-in-out infinite}.service-item-unknown{background-color:var(--color-gray-alpha-20);border-color:var(--color-gray-alpha-30)}.service-item-dependency{background-color:var(--color-purple-alpha-10);border-color:var(--color-purple-alpha-30);border-style:dashed}@keyframes health-check-border-pulse{0%,to{border-color:var(--color-primary-alpha-30)}50%{border-color:var(--color-success-alpha-40)}}.service-status-bar{position:absolute;left:0;top:0;bottom:0;width:4px;transition:all .3s ease-in-out}.status-bar-running,.status-bar-running-healthy{background-color:var(--color-success)}.status-bar-running-unhealthy{background-color:var(--color-warning)}.status-bar-running-health-starting{background:linear-gradient(90deg,var(--color-success) 0%,var(--color-primary) 100%);animation:health-check-pulse 2s ease-in-out infinite}.status-bar-starting{background-color:var(--color-primary)}.status-bar-error{background-color:var(--color-error)}.status-bar-stopped{background-color:var(--color-gray-600)}.status-bar-unknown{background-color:var(--color-gray-500)}@keyframes health-check-pulse{0%,to{opacity:1}50%{opacity:.7}}.health-check-pending{animation:health-check-pulse 2s ease-in-out infinite}.service-color-bar{position:absolute;top:0;left:0;right:0;height:4px}.color-database{background:linear-gradient(to right,var(--color-primary),var(--color-purple))}.color-messaging{background:linear-gradient(to right,var(--color-warning),var(--color-orange))}.color-monitoring{background:linear-gradient(to right,var(--color-teal),var(--color-info))}.color-visualization{background:linear-gradient(to right,var(--color-purple),var(--color-pink))}.color-orchestrator{background:linear-gradient(to right,var(--color-pink),var(--color-pink-dark))}.color-default{background:linear-gradient(to right,var(--color-primary),var(--color-indigo))}.service-content{padding:10px 12px 10px 16px;cursor:pointer}.service-header{display:flex;align-items:center;margin-bottom:6px}.service-icon{display:flex;align-items:center;justify-content:center;border-radius:4px;width:24px;height:24px;margin-right:8px;color:#fff}.service-info{flex:1;min-width:0}.service-name{font-size:.875rem;font-weight:500;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.service-meta{display:flex;justify-content:space-between;align-items:center;font-size:.75rem}.service-status{display:flex;align-items:center}.service-type-badge{font-size:.625rem;padding:2px 6px;border-radius:9999px;background-color:#1e293bcc;border:1px solid var(--color-border)}.expandable-content{max-height:0;overflow:hidden;transition:max-height .4s cubic-bezier(.4,0,.2,1),opacity .3s ease;opacity:0;will-change:max-height,opacity}.expanded{max-height:600px;opacity:1;transition:max-height .4s cubic-bezier(.4,0,.2,1),opacity .3s ease,overflow 0s .4s}.service-details{padding:8px 12px 8px 16px;border-top:1px solid var(--color-border);margin-top:4px;font-size:.75rem;transform:translateY(-10px);transition:transform .3s ease-out}.expanded .service-details{transform:translateY(0)}.expandable-content::-webkit-scrollbar{width:4px}.expandable-content::-webkit-scrollbar-track{background:var(--color-border-light);border-radius:2px}.expandable-content::-webkit-scrollbar-thumb{background:var(--color-gray-alpha-60);border-radius:2px}.expandable-content::-webkit-scrollbar-thumb:hover{background:var(--color-gray-alpha-80)}.deps-list{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}.deps-item{font-size:.625rem;padding:2px 6px;border-radius:9999px;background-color:var(--color-border-strong);border:1px solid var(--color-border)}.error-message{padding:6px;margin:8px 0;background-color:var(--color-error-alpha-10);border:1px solid var(--color-error-alpha-30);border-radius:4px;color:var(--color-error-light)}.details-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;font-size:.625rem;margin-top:8px}.details-label{color:var(--color-text-secondary)}.collapse-button{display:flex;justify-content:center;margin-top:4px}.icon-button{background:none;border:none;color:var(--color-text-secondary);cursor:pointer;padding:2px;transition:all .2s}.icon-button:hover{color:var(--color-text)}.rotate-180{transform:rotate(180deg)}.service-actions{display:flex;justify-content:flex-end;padding:8px 12px;gap:4px;flex-wrap:wrap;align-items:center}.action-button{font-size:.625rem;padding:4px 8px;border-radius:4px;display:flex;align-items:center;gap:4px;border:none;cursor:pointer;transition:all .2s;min-width:44px;height:24px;justify-content:center;white-space:nowrap}.action-icon{flex-shrink:0}.start-button{background:linear-gradient(to right,var(--color-primary),var(--color-primary-dark));color:#fff}.start-button:hover{background:linear-gradient(to right,var(--color-primary-dark),var(--color-primary-darker))}.stop-button{background:linear-gradient(to right,var(--color-red),var(--color-red-dark));color:#fff}.stop-button:hover{background:linear-gradient(to right,var(--color-error-dark),var(--color-error-darker))}.logs-button{background:linear-gradient(to right,var(--color-yellow),var(--color-yellow-dark));color:#fff}.logs-button:hover{background:linear-gradient(to right,var(--color-warning-dark),var(--color-warning-darker))}.info-button{background:linear-gradient(to right,var(--color-gray),var(--color-gray-dark));color:#fff}.info-button:hover{background:linear-gradient(to right,var(--color-gray-700),var(--color-gray-800))}.open-button{background:linear-gradient(to right,var(--color-purple),var(--color-purple-dark));color:#fff}.open-button:hover{background:linear-gradient(to right,var(--color-purple-dark),var(--color-purple-darker))}.persist-button{background:linear-gradient(to right,var(--color-slate-500),var(--color-slate-600));color:#fff;border:1px solid var(--color-slate-500)}.persist-button:hover{background:linear-gradient(to right,var(--color-slate-600),var(--color-slate-700));border-color:var(--color-slate-600);transform:translateY(-1px);box-shadow:var(--shadow-slate)}.persist-button.persist-active{background:linear-gradient(to right,var(--color-success-dark),var(--color-success-darker));border-color:var(--color-success-dark);box-shadow:0 0 12px #05966966}.persist-button.persist-active:hover{background:linear-gradient(to right,var(--color-success-darker),var(--color-success-darkest));border-color:var(--color-success-darker);transform:translateY(-1px);box-shadow:0 4px 12px #05966980}.filter-section{background-color:#1e293bb3;border-radius:8px;border:1px solid var(--color-border);padding:12px;margin-bottom:16px}.search-row{display:flex;flex-direction:column;gap:12px}@media (min-width: 768px){.search-row{flex-direction:row}}.search-container{position:relative;flex:1}.search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--color-slate-400)}.search-input{width:100%;padding:8px 8px 8px 36px;border-radius:8px;border:1px solid var(--color-border);background-color:#11182780;color:var(--color-text);font-size:.875rem}.search-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px #3b82f64d}.clear-button{position:absolute;right:8px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--color-slate-400);cursor:pointer}.filter-container{position:relative;width:100%;display:flex;align-items:center}@media (min-width: 768px){.filter-container{width:192px}}.filter-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--color-slate-400);z-index:1;pointer-events:none}.filter-select{width:100%;padding:8px 32px 8px 36px;border-radius:8px;border:1px solid var(--color-border);background-color:#11182780;color:var(--color-text);font-size:.875rem;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right 8px center;background-repeat:no-repeat;background-size:16px 16px}.filter-select:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 2px #3b82f64d}.select-arrow{position:absolute;right:12px;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--color-slate-400)}.filter-results{display:flex;align-items:center;justify-content:space-between;margin-top:12px;font-size:.75rem;color:var(--color-slate-400)}.results-count span{color:var(--color-indigo-400);font-weight:500}.clear-filters{display:flex;align-items:center;gap:4px;color:var(--color-primary);background:none;border:none;cursor:pointer;padding:4px 8px;border-radius:4px;font-size:.75rem}.clear-filters:hover{background-color:#3b82f61a}.view-toggle{display:flex;background-color:#1e293bb3;border-radius:6px;border:1px solid var(--color-border);overflow:hidden}.toggle-button{padding:6px;background:none;border:none;cursor:pointer;color:var(--color-slate-400)}.toggle-button:hover{color:var(--color-text)}.toggle-button.active{background:linear-gradient(to right,var(--color-primary),var(--color-primary-dark));color:#fff}.no-results{text-align:center;padding:40px 0;background-color:#1e293b80;border-radius:8px;border:1px solid var(--color-border)}.no-results-icon{width:48px;height:48px;margin:0 auto 12px;color:var(--color-gray-500)}.no-results-text{margin-bottom:8px;color:var(--color-slate-400)}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.05)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeOut{0%{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(-10px) scale(.95)}}.pulse{animation:pulse 1s infinite}.fade-in{animation:fadeIn .3s ease-out forwards}.fade-out{animation:fadeOut .2s ease-in forwards}.text-green{color:var(--color-success)}.text-red{color:var(--color-error)}.text-gray{color:var(--color-gray-500)}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}.action-button{transition:all .2s}.action-button:hover{transform:translateY(-1px)}.action-button.start-button{background:linear-gradient(135deg,var(--color-success),var(--color-success-dark));border-color:var(--color-success)}.action-button.start-button:hover{background:linear-gradient(135deg,var(--color-success-dark),var(--color-success-darker));border-color:var(--color-success-dark);box-shadow:var(--shadow-success)}.action-button.stop-button{background:linear-gradient(135deg,var(--color-error),var(--color-error-dark));border-color:var(--color-error)}.action-button.stop-button:hover{background:linear-gradient(135deg,var(--color-error-dark),var(--color-error-darker));border-color:var(--color-error-dark);box-shadow:var(--shadow-error)}.action-button.open-button{background:linear-gradient(135deg,var(--color-purple),var(--color-purple-dark));border-color:var(--color-purple)}.action-button.open-button:hover{background:linear-gradient(135deg,var(--color-purple-dark),var(--color-purple-darker));border-color:var(--color-purple-dark);box-shadow:var(--shadow-purple)}.action-button.info-button{background:linear-gradient(135deg,var(--color-info),var(--color-info-dark));border-color:var(--color-info)}.action-button.info-button:hover{background:linear-gradient(135deg,var(--color-info-dark),var(--color-info-darker));border-color:var(--color-info-dark);box-shadow:var(--shadow-info)}.action-button.logs-button{background:linear-gradient(135deg,var(--color-slate-500),var(--color-slate-600));border-color:var(--color-slate-500)}.action-button.logs-button:hover{background:linear-gradient(135deg,var(--color-slate-600),var(--color-slate-700));border-color:var(--color-slate-600);box-shadow:var(--shadow-slate)}.connection-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000000b3;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fade-in .2s ease-out}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.connection-modal{background:var(--color-gray-800);color:var(--color-gray-50);border-radius:12px;min-width:600px;max-width:800px;max-height:85vh;overflow-y:auto;box-shadow:0 25px 50px -12px #0006;border:1px solid var(--color-gray-700);animation:modal-slide-up .3s ease-out}@keyframes modal-slide-up{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.connection-modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid var(--color-gray-700);background:var(--color-gray-900);border-radius:12px 12px 0 0}.connection-modal-title{margin:0;font-size:1.25rem;font-weight:600;color:var(--color-gray-50)}.modal-header-actions{display:flex;align-items:center;gap:12px}.copy-feedback{padding:6px 12px;background:var(--color-success-darkest);color:var(--color-success-light);border-radius:6px;font-size:.875rem;font-weight:500;animation:slide-in-right .2s ease-out}@keyframes slide-in-right{0%{transform:translate(20px);opacity:0}to{transform:translate(0);opacity:1}}.connection-modal-close{background:none;border:none;padding:8px;border-radius:6px;cursor:pointer;color:var(--color-gray-400);transition:all .2s;display:flex;align-items:center;justify-content:center}.connection-modal-close:hover{background:var(--color-gray-700);color:var(--color-gray-50)}.connection-modal-content{padding:24px;max-height:calc(85vh - 80px);overflow-y:auto}.connection-error{text-align:center;color:var(--color-error-light);padding:20px}.error-detail{margin-top:8px;font-size:.875rem;color:var(--color-gray-400)}.status-info{margin-top:12px;font-size:.875rem;color:var(--color-gray-400)}.status-badge{display:inline-block;padding:4px 8px;border-radius:12px;font-size:.75rem;font-weight:600;text-transform:uppercase}.status-running{background-color:var(--color-success-darkest);color:var(--color-success-light)}.status-stopped,.status-error{background-color:var(--color-error-darkest);color:var(--color-error-lightest)}.status-starting,.status-stopping{background-color:var(--color-warning-darkest);color:var(--color-warning-lightest)}.connection-details{display:flex;flex-direction:column;gap:20px}.connection-section{border:1px solid var(--color-gray-700);border-radius:8px;overflow:hidden;background:var(--color-gray-700)}.connection-section-title{display:flex;align-items:center;gap:8px;margin:0;padding:12px 16px;background:var(--color-gray-900);font-size:1rem;font-weight:600;color:var(--color-gray-50);border-bottom:1px solid var(--color-gray-600)}.connection-section .connection-item{padding:12px 16px;border-bottom:1px solid var(--color-gray-600);background:var(--color-gray-700)}.connection-section .connection-item:last-child{border-bottom:none}.connection-table{width:100%;border-collapse:collapse;background:var(--color-gray-700)}.connection-table th{background:var(--color-gray-800);color:var(--color-gray-300);font-weight:600;font-size:.875rem;padding:12px;text-align:left;border-bottom:1px solid var(--color-gray-600)}.connection-table td{padding:10px 12px;border-bottom:1px solid var(--color-gray-600);color:var(--color-gray-50);font-size:.875rem}.connection-table tr:last-child td{border-bottom:none}.connection-table tr:hover{background:var(--color-gray-600)}.port-type-badge{display:inline-block;padding:2px 6px;border-radius:4px;font-size:.75rem;font-weight:500;text-transform:uppercase}.port-type-exposed{background:var(--color-success-darkest);color:var(--color-success-light)}.port-type-internal{background:var(--color-blue-600);color:var(--color-blue-200)}.connection-url{color:var(--color-blue-400);text-decoration:none;display:flex;align-items:center;gap:4px;font-family:SF Mono,Monaco,Inconsolata,Roboto Mono,monospace}.connection-url:hover{color:var(--color-primary-light);text-decoration:underline}.connection-item{display:flex;flex-direction:column;gap:4px;margin-bottom:12px}.connection-item:last-child{margin-bottom:0}.connection-label{font-weight:500;color:var(--color-gray-300);font-size:.875rem}.connection-value-row{display:flex;align-items:center;gap:8px}.connection-actions{display:flex;align-items:center;gap:4px}.connection-value{font-family:SF Mono,Monaco,Inconsolata,Roboto Mono,monospace;font-size:.875rem;color:var(--color-gray-50);word-break:break-all;flex:1}.connection-link{color:var(--color-blue-400)!important;text-decoration:none;display:flex;align-items:center;gap:4px;transition:color .2s}.connection-link:hover{color:var(--color-primary-light)!important;text-decoration:underline}.connection-command{background:var(--color-gray-800);color:var(--color-gray-50);padding:8px 12px;border-radius:4px;border:1px solid var(--color-gray-600)}.copy-button{background:var(--color-gray-700);border:1px solid var(--color-gray-600);border-radius:4px;padding:6px;cursor:pointer;color:var(--color-gray-300);transition:all .2s;display:flex;align-items:center;justify-content:center;min-width:32px;height:32px}.copy-button:hover{background:var(--color-gray-600);color:var(--color-gray-50);border-color:var(--color-gray-500)}.connection-description{font-size:.75rem;color:var(--color-gray-400);font-style:italic;margin-top:4px}.connection-note{font-size:.75rem;color:var(--color-warning-light);background:var(--color-warning-bg-dark);padding:4px 8px;border-radius:4px;margin-top:4px;display:inline-block;border:1px solid var(--color-warning-dark)}@media (max-width: 768px){.connection-modal{min-width:95vw;max-width:95vw;margin:0 10px}.connection-table{font-size:.75rem}.connection-table th,.connection-table td{padding:8px}}.about-modal{max-width:500px}.about-content{display:flex;flex-direction:column;gap:24px}.about-hero{text-align:center;padding-bottom:16px;border-bottom:1px solid #374151}.about-logo{display:flex;align-items:center;justify-content:center;width:64px;height:64px;background:linear-gradient(to bottom right,#3b82f6,#4f46e5);border-radius:16px;margin:0 auto 16px;box-shadow:0 0 20px #3b82f666}.about-logo .logo-icon{color:#fff}.about-title{font-size:24px;font-weight:700;margin:0 0 8px;color:var(--color-gray-50)}.about-subtitle{font-size:14px;color:var(--color-gray-400);margin:0}.about-description p{margin:0 0 12px;line-height:1.6;color:var(--color-gray-300)}.about-features h4{font-size:16px;font-weight:600;margin:0 0 12px;color:var(--color-gray-50)}.about-features ul{list-style:none;padding:0;margin:0}.about-features li{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:14px;color:var(--color-gray-300);line-height:1.5}.feature-icon{color:var(--color-success);flex-shrink:0}.about-links h4{font-size:16px;font-weight:600;margin:0 0 12px;color:var(--color-gray-50)}.link-buttons{display:flex;gap:12px;flex-wrap:wrap}.about-content .link-button{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--color-gray-700);border:1px solid var(--color-gray-600);border-radius:6px;color:var(--color-gray-300);text-decoration:none;font-size:14px;transition:all .2s ease;cursor:pointer;font-family:inherit}.about-content .link-button:hover{background:var(--color-gray-600);border-color:var(--color-gray-500);color:var(--color-gray-50);transform:translateY(-1px)}.about-content .link-button:active{transform:translateY(0)}.about-footer{text-align:center;padding-top:16px;border-top:1px solid var(--color-gray-700)}.about-version{font-size:12px;color:var(--color-gray-500);margin:0 0 4px}.about-copyright{font-size:12px;color:var(--color-gray-400);margin:0}@media (max-width: 640px){.about-modal{max-width:95%}.link-buttons{flex-direction:column}.link-button{justify-content:center}}.link-button{display:inline-flex;align-items:center;gap:6px;color:var(--color-blue-400);background:none;border:1px solid var(--color-gray-700);border-radius:6px;padding:6px 10px;cursor:pointer;transition:all .2s ease;text-decoration:none;font-size:12px;font-weight:500;font-family:inherit}.link-button:hover{background:var(--color-gray-700);border-color:var(--color-blue-400);color:var(--color-primary-light);transform:translateY(-1px)}.link-icon{flex-shrink:0}@media (max-width: 480px){.service-actions{gap:3px;padding:6px 8px}.action-button{min-width:40px;font-size:.5rem;padding:3px 6px}.action-icon{width:8px;height:8px}}@media (max-width: 1024px){.header-actions{gap:8px}.status-bar{display:none!important}}@media (max-width: 768px){.header-content{gap:8px}.header-actions{gap:6px}.button{padding:4px 8px;font-size:.75rem}.button .sr-only{display:none}}@media (max-width: 480px){.header{padding:8px 0}.container{padding:0 12px}.logo-container{gap:8px}.logo{width:28px;height:28px}.logo-text{font-size:1rem}.header-actions{gap:4px}.button{padding:3px 6px;font-size:.625rem;min-width:32px}.button-icon{width:12px;height:12px}}.logs-modal{width:90vw;max-width:1000px;height:85vh;max-height:800px;display:flex;flex-direction:column}.logs-controls{display:flex;gap:12px;align-items:center;padding:12px 20px;background:var(--color-gray-800);border-bottom:1px solid var(--color-gray-700);flex-wrap:wrap}.logs-search{position:relative;flex:1;min-width:200px}.search-icon{position:absolute;left:8px;top:50%;transform:translateY(-50%);color:var(--color-gray-400)}.logs-search-input{width:100%;padding:6px 12px 6px 32px;background:var(--color-gray-900);border:1px solid var(--color-gray-700);border-radius:4px;color:var(--color-gray-100);font-size:14px}.logs-search-input:focus{outline:none;border-color:var(--color-primary)}.logs-filter{position:relative;display:flex;align-items:center;min-width:140px}.logs-filter .filter-icon{position:absolute;left:8px;top:50%;transform:translateY(-50%);color:var(--color-gray-400);pointer-events:none;z-index:1}.logs-level-select{width:100%;padding:6px 28px;background:var(--color-gray-900);border:1px solid var(--color-gray-700);border-radius:4px;color:var(--color-gray-100);font-size:14px;-webkit-appearance:none;-moz-appearance:none;appearance:none;position:relative;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%239ca3af' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right 8px center;background-repeat:no-repeat;background-size:14px 14px}.logs-level-select:focus{outline:none;border-color:var(--color-primary)}.logs-options{display:flex;align-items:center;gap:12px}.logs-checkbox{display:flex;align-items:center;gap:6px;color:var(--color-gray-100);font-size:14px;cursor:pointer}.logs-checkbox input[type=checkbox]{accent-color:var(--color-primary)}.logs-clear-button{padding:6px 12px;background:var(--color-error-dark);color:#fff;border:none;border-radius:4px;font-size:14px;cursor:pointer;transition:background-color .2s}.logs-clear-button:hover{background:var(--color-error-darker)}.logs-content{flex:1;display:flex;flex-direction:column;overflow:hidden}.logs-container{flex:1;overflow-y:auto;padding:16px 20px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:13px;line-height:1.4;background:var(--color-logs-bg);scrollbar-width:thin;scrollbar-color:var(--color-gray-700) var(--color-gray-800)}.logs-container::-webkit-scrollbar{width:8px}.logs-container::-webkit-scrollbar-track{background:var(--color-gray-800)}.logs-container::-webkit-scrollbar-thumb{background:var(--color-gray-700);border-radius:4px}.logs-container::-webkit-scrollbar-thumb:hover{background:var(--color-gray-600)}.log-entry{display:flex;gap:12px;margin-bottom:4px;align-items:baseline;word-wrap:break-word}.log-timestamp{color:var(--color-gray-500);font-size:12px;white-space:nowrap;min-width:80px}.log-level{font-weight:600;font-size:11px;white-space:nowrap;min-width:60px}.log-message{color:var(--color-gray-100);flex:1;white-space:pre-wrap}.logs-empty{display:flex;align-items:center;justify-content:center;height:200px;color:var(--color-gray-400);text-align:center;font-style:italic}.logs-error{background:var(--color-error-bg-light);color:var(--color-error-dark);padding:8px 12px;border-radius:4px;margin:16px 20px;border:1px solid var(--color-error-lightest)}.logs-loading{display:flex;align-items:center;justify-content:center;height:100px;color:var(--color-gray-400);font-style:italic}.logs-control-button{padding:6px 12px;background:var(--color-gray-700);color:var(--color-gray-100);border:1px solid var(--color-gray-600);border-radius:4px;font-size:14px;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:6px}.logs-control-button:hover{background:var(--color-gray-600)}.logs-control-button:disabled{opacity:.5;cursor:not-allowed}.logs-control-button.streaming{background:var(--color-error-dark);border-color:var(--color-error-darker)}.logs-control-button.streaming:hover{background:var(--color-error-darker)}.text-red-400{color:var(--color-red-400)}.text-yellow-400{color:var(--color-yellow-400)}.text-blue-400{color:var(--color-blue-400)}.text-gray-400{color:var(--color-gray-400)}.text-gray-300{color:var(--color-gray-300)}.text-green-400{color:var(--color-green-400)}@media (max-width: 768px){.logs-modal{width:95vw;height:90vh}.logs-controls{flex-direction:column;align-items:stretch;gap:8px}.logs-search{min-width:auto}.logs-options{justify-content:space-between}.log-entry{flex-direction:column;gap:4px;align-items:flex-start}.log-timestamp,.log-level{min-width:auto}}.progress-modal{max-width:600px;width:90vw}.progress-content{display:flex;flex-direction:column;gap:20px}.progress-info{display:flex;flex-direction:column;gap:8px;padding:16px;background:var(--color-gray-900);border-radius:8px;border:1px solid var(--color-gray-700)}.progress-info-item{display:flex;justify-content:space-between;align-items:center}.progress-label{font-weight:600;color:var(--color-gray-400);font-size:14px}.progress-value{font-weight:500;color:var(--color-gray-50);font-size:14px}.progress-image-name{font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:13px;color:var(--color-blue-400)}.progress-section{display:flex;flex-direction:column;gap:8px}.progress-header{display:flex;justify-content:space-between;align-items:center}.progress-title{font-weight:600;color:var(--color-gray-50);font-size:14px;display:flex;align-items:center}.progress-percentage{font-weight:700;color:var(--color-blue-400);font-size:16px}.progress-meta{font-size:12px;color:var(--color-gray-400)}.progress-bar-container{width:100%;height:8px;background:var(--color-gray-700);border-radius:4px;overflow:hidden;position:relative}.progress-bar{height:100%;background:linear-gradient(to right,var(--color-primary),var(--color-primary-darker));border-radius:4px;transition:width .3s ease;position:relative}.progress-bar:after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);animation:shimmer 2s infinite}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.progress-layer{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;background:var(--color-gray-800);border-radius:6px;border:1px solid var(--color-gray-700)}.layer-label{font-size:12px;color:var(--color-gray-400);font-weight:500}.layer-id{font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:12px;color:var(--color-blue-400);background:var(--color-gray-700);padding:2px 6px;border-radius:4px}.progress-stats{display:flex;gap:16px;padding:16px;background:var(--color-gray-900);border-radius:8px;border:1px solid var(--color-gray-700)}.progress-stat{display:flex;align-items:center;gap:8px;flex:1}.progress-stat svg{color:var(--color-blue-400);flex-shrink:0}.stat-content{display:flex;flex-direction:column;gap:2px}.stat-label{font-size:11px;color:var(--color-gray-400);font-weight:500;text-transform:uppercase;letter-spacing:.5px}.stat-value{font-size:13px;color:var(--color-gray-50);font-weight:600}.progress-transfer{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:var(--color-gray-800);border-radius:6px;border:1px solid var(--color-gray-700)}.transfer-label{font-size:13px;color:var(--color-gray-400);font-weight:500}.transfer-value{font-size:13px;color:var(--color-gray-50);font-weight:600;font-family:Monaco,Menlo,Ubuntu Mono,monospace}.progress-error{display:flex;align-items:flex-start;gap:8px;padding:16px;background:#ef44441a;border:1px solid rgba(239,68,68,.3);border-radius:8px;color:var(--color-error-lightest);margin-top:16px}.error-icon{color:var(--color-error);flex-shrink:0;margin-top:2px}.error-content{flex:1}.error-title{font-weight:600;margin-bottom:8px;color:var(--color-error)}.error-details{margin-bottom:12px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.875rem;background:#0000004d;padding:8px;border-radius:4px;word-break:break-word}.error-help{font-size:.875rem}.error-help ul{margin:8px 0 0 16px;padding:0}.error-help li{margin-bottom:4px}.error-help code{background:#0006;padding:2px 6px;border-radius:3px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.8rem;color:var(--color-gray-neutral)}.progress-success{display:flex;align-items:center;gap:8px;padding:12px 16px;background:var(--color-success-bg-darkest);border:1px solid var(--color-success);border-radius:6px;color:var(--color-success-light);font-size:14px}.success-icon{flex-shrink:0}.progress-footer{display:flex;justify-content:center;padding:16px 24px;border-top:1px solid var(--color-gray-700);background:var(--color-gray-900)}.progress-footer .button{min-width:120px}@media (max-width: 640px){.progress-modal{width:95vw}.progress-stats{flex-direction:column;gap:12px}.progress-stat{justify-content:space-between}.stat-content{align-items:flex-end;text-align:right}.progress-info-item,.progress-transfer{flex-direction:column;align-items:flex-start;gap:4px}}.footer{background-color:var(--color-card-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--color-border);padding:16px 0;margin-top:auto}.footer-content{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}.footer-status{display:flex;align-items:center;gap:8px}.footer-status p{margin:0;font-size:.875rem;color:var(--color-text);font-weight:500}.footer-info{font-size:.75rem;color:var(--color-slate-400);display:flex;align-items:center;gap:8px}@media (max-width: 768px){.footer-content{flex-direction:column;align-items:center;text-align:center;gap:8px}.footer-info{font-size:.7rem}}.animate-bounce{animation:bounce 1s infinite}@keyframes bounce{0%,20%,53%,80%,to{transform:translateY(0)}40%,43%{transform:translateY(-8px)}70%{transform:translateY(-4px)}90%{transform:translateY(-2px)}}.service-name-row{display:flex;align-items:center;gap:8px}.image-status{display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:var(--color-gray-800);border:2px solid;cursor:pointer;transition:all .2s}.image-status.ready{border-color:var(--color-success);color:var(--color-success)}.image-status.missing{border-color:var(--color-warning);color:var(--color-warning)}.image-status.downloading{border-color:var(--color-primary);color:var(--color-primary)}.image-status.unknown{border-color:var(--color-gray-500);color:var(--color-gray-500)}.image-status:hover{transform:scale(1.1)}.dependencies-section{margin-top:16px;padding-top:16px;border-top:1px solid #374151}.dependencies-header{margin-bottom:8px}.dependencies-label{font-weight:600;color:var(--color-gray-200-light);font-size:.75rem}.dependencies-list{display:flex;flex-direction:column;gap:6px}.dependency-item{display:flex;align-items:center;gap:8px;padding:6px 8px;background-color:#3741514d;border-radius:6px;border:1px solid rgba(107,114,128,.2);font-size:.7rem}.dependency-name{flex:1;color:var(--color-gray-200-light);font-weight:500}.dependency-container-status{font-size:.65rem;padding:2px 6px;border-radius:4px;text-transform:uppercase;font-weight:600;letter-spacing:.5px;text-align:right}.dependency-status-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.dependency-status-dot.status-running,.dependency-status-dot.status-running-healthy,.dependency-status-dot.status-running-health-starting{background-color:var(--color-success);box-shadow:0 0 6px #10b98199}.dependency-status-dot.status-running-unhealthy{background-color:var(--color-warning-dark);box-shadow:0 0 6px #d9770699}.dependency-status-dot.status-stopped{background-color:var(--color-gray-500)}.dependency-status-dot.status-starting{background-color:var(--color-primary);animation:pulse 2s infinite}.dependency-status-dot.status-completed{background-color:var(--color-success);box-shadow:0 0 6px #10b98166}.dependency-status-dot.status-failed{background-color:var(--color-error);box-shadow:0 0 6px #ef444466}.dependency-status-dot.status-unknown{background-color:var(--color-gray-500);opacity:.5}.running-services-compact{margin-bottom:16px}.running-services-compact .compact-header{padding:12px 16px;min-height:auto}.running-services-compact .compact-header .card-title{gap:8px}.running-services-compact .compact-header .card-title h2{font-size:16px;font-weight:600;margin:0}.running-services-compact .compact-header .card-icon{width:28px;height:28px;display:flex;align-items:center;justify-content:center}.running-services-compact .compact-body{padding:8px 16px 16px}.running-services-compact .compact-grid{gap:8px}.running-services-compact .service-item{padding:8px}.running-services-compact .service-header{padding:0}.running-services-compact .service-actions{padding:8px 0 0;gap:6px}.running-services-compact .action-button{padding:4px 8px;font-size:11px;min-height:24px}.running-services-compact .action-icon{width:8px;height:8px}.running-services-compact .service-name{font-size:14px;font-weight:600}.running-services-compact .service-meta{gap:8px;margin-top:2px}.running-services-compact .service-status{font-size:11px}.running-services-compact .service-type-badge{font-size:10px;padding:2px 6px}.running-services-compact .status-indicator{font-size:12px}.running-services-compact{transition:all .3s ease-in-out}.logs-panel{position:fixed;top:0;right:0;width:400px;height:100vh;background-color:var(--color-gray-800);border-left:1px solid var(--color-gray-700);display:flex;flex-direction:column;z-index:1000;box-shadow:-4px 0 6px -1px #0000001a}.logs-panel-header{padding:16px;border-bottom:1px solid var(--color-gray-700);background-color:var(--color-gray-900);display:flex;justify-content:space-between;align-items:center;flex-shrink:0}.logs-panel-header h3{margin:0;color:var(--color-gray-50);font-size:18px;font-weight:600}.logs-panel-controls{display:flex;gap:8px;align-items:center}.logs-control-btn{background:var(--color-gray-700);border:1px solid var(--color-gray-600);color:var(--color-gray-300);padding:6px 8px;border-radius:6px;cursor:pointer;transition:all .2s;font-size:14px;display:flex;align-items:center;justify-content:center;min-width:32px;height:32px}.logs-control-btn:hover{background:var(--color-gray-600);border-color:var(--color-gray-500)}.logs-control-btn.paused{background:var(--color-success-dark);border-color:var(--color-success);color:#fff}.logs-control-btn.close-btn{background:var(--color-error-dark);border-color:var(--color-error);color:#fff}.logs-control-btn.close-btn:hover{background:var(--color-error-darker);border-color:var(--color-error-dark)}.logs-panel-content{flex:1;display:flex;flex-direction:column;overflow:hidden}.logs-loading,.logs-error,.logs-empty{padding:24px 16px;text-align:center;color:var(--color-gray-400);font-size:14px}.logs-error{color:var(--color-red-400);display:flex;flex-direction:column;align-items:center;gap:12px}.retry-btn{background:var(--color-gray-700);border:1px solid var(--color-gray-600);color:var(--color-gray-300);padding:6px 12px;border-radius:6px;cursor:pointer;font-size:12px;transition:all .2s}.retry-btn:hover{background:var(--color-gray-600);border-color:var(--color-gray-500)}.logs-list{flex:1;overflow-y:auto;padding:8px;scroll-behavior:smooth}.logs-list::-webkit-scrollbar{width:8px}.logs-list::-webkit-scrollbar-track{background:var(--color-gray-700);border-radius:4px}.logs-list::-webkit-scrollbar-thumb{background:var(--color-gray-500);border-radius:4px}.logs-list::-webkit-scrollbar-thumb:hover{background:var(--color-gray-400)}.log-entry{display:flex;align-items:flex-start;gap:12px;padding:6px 8px;border-radius:4px;margin-bottom:2px;font-size:12px;line-height:1.4;transition:background-color .1s ease}.log-entry:hover{background-color:#3741514d}.log-timestamp{color:var(--color-gray-500);font-weight:500;white-space:nowrap;flex-shrink:0;font-size:11px;padding-top:1px}.log-message{color:var(--color-gray-200);word-wrap:break-word;white-space:pre-wrap;flex:1}.logs-paused-indicator{position:absolute;bottom:16px;left:50%;transform:translate(-50%);background:var(--color-warning);color:var(--color-gray-800);padding:6px 12px;border-radius:16px;font-size:12px;font-weight:600;box-shadow:0 2px 4px #0003;animation:pulse 2s infinite}.app-container.logs-visible{margin-right:400px;transition:margin-right .3s ease}@media (max-width: 768px){.logs-panel{width:100%;left:0;right:0}.app-container.logs-visible{margin-right:0;display:none}.logs-panel-header h3{font-size:16px}.log-entry{flex-direction:column;gap:4px;align-items:flex-start}.log-timestamp{font-size:10px}.log-message{font-size:11px}}.error-message{border-radius:8px;padding:10px;margin:10px;box-shadow:0 2px 8px #0000001a;animation:slideIn .3s ease-out}.error-message-error{background-color:#ef44441a;border:1px solid rgba(239,68,68,.3);color:var(--color-error-lightest)}.error-message-warning{background-color:#f59e0b1a;border:1px solid rgba(245,158,11,.3);color:var(--color-warning-lightest)}.error-message-info{background-color:#3b82f61a;border:1px solid rgba(59,130,246,.3);color:var(--color-info-lightest)}.error-message-success{background-color:#22c55e1a;border:1px solid rgba(34,197,94,.3);color:var(--color-success-lightest)}.error-message-content{width:100%}.error-message-header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.error-message-icon{flex-shrink:0;display:flex;align-items:center}.error-message-text{flex:1;min-width:0;margin-bottom:8px}.error-message-title{font-weight:600;font-size:.875rem;line-height:1.25;margin:0}.error-message-description{font-size:.875rem;line-height:1.4;margin-bottom:8px}.error-message-details{margin-top:8px}.error-message-details summary{cursor:pointer;font-size:.75rem;color:var(--color-gray-400);outline:none}.error-message-details summary:hover{color:var(--color-gray-300)}.error-message-details-content{margin-top:8px;padding:8px;background:#0003;border-radius:4px;font-family:Monaco,Menlo,Ubuntu Mono,monospace;font-size:.75rem;line-height:1.4;word-break:break-word;white-space:pre-wrap}.error-message-actions{display:flex;align-items:center;gap:8px;margin-left:auto;flex-shrink:0}.error-message-action{display:flex;align-items:center;gap:4px;padding:4px 8px;border-radius:4px;font-size:.75rem;font-weight:500;border:1px solid transparent;cursor:pointer;transition:all .2s ease}.error-message-action.primary{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.error-message-action.primary:hover{background:var(--color-primary-dark);border-color:var(--color-primary-dark)}.error-message-action.secondary{background:#ffffff1a;color:var(--color-gray-300);border-color:#fff3}.error-message-action.secondary:hover{background:#fff3;border-color:#ffffff4d}.error-message-action:disabled{opacity:.5;cursor:not-allowed}.error-message-close{background:none;border:none;color:currentColor;cursor:pointer;padding:4px;border-radius:4px;opacity:.7;transition:opacity .2s ease}.error-message-close:hover{opacity:1;background:#ffffff1a}.error-toast{position:fixed;top:20px;right:20px;z-index:9999;min-width:300px;max-width:500px;border-radius:8px;padding:12px;box-shadow:0 4px 12px #0000004d;animation:slideInFromRight .3s ease-out}.error-toast-error{background:var(--color-error-bg-darkest);border:1px solid var(--color-error);color:var(--color-error-lightest)}.error-toast-warning{background:var(--color-warning-bg-darkest);border:1px solid var(--color-warning);color:var(--color-warning-lightest)}.error-toast-info{background:var(--color-info-bg-darkest);border:1px solid var(--color-info);color:var(--color-info-lightest)}.error-toast-success{background:var(--color-success-bg-darkest);border:1px solid var(--color-success);color:var(--color-success-lightest)}.error-toast-content{display:flex;align-items:center;gap:8px}.error-toast-icon{flex-shrink:0}.error-toast-message{flex:1;font-size:.875rem;line-height:1.4}.error-toast-close{background:none;border:none;color:currentColor;cursor:pointer;padding:2px;border-radius:2px;opacity:.7;transition:opacity .2s ease;flex-shrink:0}.error-toast-close:hover{opacity:1;background:#ffffff1a}.error-toast-container{position:fixed;top:20px;right:20px;z-index:9999;display:flex;flex-direction:column;gap:8px;pointer-events:none}.error-toast-container .error-toast{pointer-events:all}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInFromRight{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}:root{--color-error-lightest: #fecaca;--color-error-bg-darkest: rgba(127, 29, 29, .9);--color-warning-lightest: #fde68a;--color-warning: #f59e0b;--color-warning-bg-darkest: rgba(120, 53, 15, .9);--color-info-lightest: #bfdbfe;--color-info: #3b82f6;--color-info-bg-darkest: rgba(30, 58, 138, .9);--color-success-lightest: #bbf7d0;--color-success: #22c55e;--color-success-bg-darkest: rgba(21, 128, 61, .9)}.actions-dropdown{position:relative;display:inline-block}.dropdown-menu{position:absolute;top:calc(100% + 8px);right:0;min-width:180px;background:var(--color-gray-800);border:1px solid var(--color-gray-700);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);padding:8px;z-index:var(--z-dropdown);animation:dropdown-appear .2s ease-out;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}@keyframes dropdown-appear{0%{opacity:0;transform:translateY(-8px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.dropdown-item{display:flex;align-items:center;gap:12px;width:100%;padding:10px 12px;background:transparent;border:none;border-radius:var(--radius-md);color:var(--color-gray-200);font-size:14px;font-weight:500;cursor:pointer;transition:var(--transition-fast);text-align:left}.dropdown-item:hover:not(:disabled){background:var(--color-gray-700);color:var(--color-gray-50)}.dropdown-item:active:not(:disabled){background:var(--color-gray-600);transform:scale(.98)}.dropdown-item:disabled{opacity:.5;cursor:not-allowed;color:var(--color-gray-500)}.dropdown-item-danger{color:var(--color-red-400)}.dropdown-item-danger:hover:not(:disabled){background:#ef44441a;color:var(--color-red-300)}.dropdown-icon{flex-shrink:0;width:16px;height:16px;opacity:.8}.dropdown-item:hover .dropdown-icon{opacity:1}.dropdown-separator{height:1px;background:var(--color-gray-700);margin:8px 0}@media (max-width: 768px){.dropdown-menu{right:-8px;min-width:160px}.dropdown-item{padding:12px 14px;font-size:15px}}.custom-services-card{margin-top:32px}.custom-services-list{display:flex;flex-direction:column;gap:16px}.custom-service-item{background:var(--color-surface-elevated);border:1px solid var(--color-border);border-radius:12px;overflow:hidden;transition:all .2s ease}.custom-service-item:hover{border-color:var(--color-border-strong);background:var(--color-surface-hover)}.custom-service-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;cursor:pointer;transition:all .2s ease}.custom-service-header:hover{background:#4b556333}.custom-service-info{flex:1;min-width:0}.custom-service-name{display:flex;align-items:center;gap:8px;margin-bottom:4px}.service-name-text{font-size:16px;font-weight:600;color:var(--color-text)}.warning-badge{background:var(--color-warning-alpha-15);color:var(--color-warning);font-size:11px;font-weight:600;padding:2px 6px;border-radius:4px;display:flex;align-items:center;gap:2px}.warning-icon{width:12px;height:12px}.custom-service-description{color:var(--color-text-secondary);font-size:14px;margin-bottom:8px;line-height:1.4}.custom-service-meta{display:flex;align-items:center;gap:16px;font-size:12px;color:var(--color-text-muted)}.service-count{font-weight:500}.service-filename{font-family:SF Mono,Monaco,Menlo,Consolas,monospace;background:#4b55634d;padding:2px 6px;border-radius:4px}.custom-service-actions{display:flex;align-items:center;gap:8px}.expand-button{width:32px;height:32px;border:none;background:#4b55634d;color:var(--color-text-secondary);border-radius:6px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.expand-button:hover{background:#4b556380;color:var(--color-text)}.expand-button svg{transition:transform .2s ease}.expand-button.expanded svg{transform:rotate(180deg)}.custom-service-details{border-top:1px solid var(--color-border);padding:20px;background:var(--color-surface);animation:slideDown .2s ease}@keyframes slideDown{0%{opacity:0;max-height:0;padding-top:0;padding-bottom:0}to{opacity:1;max-height:500px;padding-top:20px;padding-bottom:20px}}.warnings-section{margin-bottom:20px}.warnings-title{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--color-warning);margin-bottom:8px}.warnings-list{list-style:none;padding:0;margin:0}.warning-item{background:var(--color-warning-alpha-10);border:1px solid var(--color-warning-alpha-30);color:var(--color-warning-light);padding:8px 12px;border-radius:6px;font-size:13px;margin-bottom:4px;line-height:1.4}.warning-item:last-child{margin-bottom:0}.services-section{margin-bottom:20px}.services-title{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--color-text);margin-bottom:12px}.services-icon{width:16px;height:16px;color:var(--color-text-secondary)}.service-tag{background:var(--color-primary-alpha-10);color:var(--color-primary-light);font-size:12px;font-weight:500;padding:4px 8px;border-radius:4px;border:1px solid var(--color-primary-alpha-30)}.no-services{color:var(--color-text-muted);font-style:italic;font-size:13px}.file-info{display:flex;flex-direction:column;gap:8px;font-size:12px}.file-info-item{display:flex;align-items:center;gap:8px}.file-info-label{color:var(--color-text-secondary);font-weight:500;min-width:60px}.file-info-value{color:var(--color-text-muted);font-family:SF Mono,Monaco,Menlo,Consolas,monospace}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.modal-container{background:var(--color-surface-elevated);border:1px solid var(--color-border);border-radius:16px;width:100%;max-width:600px;max-height:90vh;overflow:hidden;box-shadow:0 25px 50px -12px #00000040,0 20px 25px -5px #0000001a;animation:modalSlideIn .3s ease}.modal-container.large{max-width:800px}@keyframes modalSlideIn{0%{opacity:0;transform:scale(.95) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:24px 24px 16px;border-bottom:1px solid var(--color-border);margin-bottom:0}.modal-title{display:flex;align-items:center;gap:12px;font-size:20px;font-weight:600;color:var(--color-text);margin:0}.modal-icon{width:40px;height:40px;border-radius:8px;display:flex;align-items:center;justify-content:center}.modal-close{width:32px;height:32px;border:none;background:#4b55634d;color:var(--color-text-secondary);border-radius:6px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.modal-close:hover{background:#4b556380;color:var(--color-text)}.modal-body{padding:24px;max-height:calc(90vh - 120px);overflow-y:auto}.form-group{margin-bottom:20px}.form-label{display:block;font-size:14px;font-weight:600;color:var(--color-text);margin-bottom:6px}.form-input{width:100%;padding:12px 16px;background:var(--color-surface);border:1px solid var(--color-border);border-radius:8px;color:var(--color-text);font-size:14px;transition:all .2s ease}.form-input:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-alpha-10)}.form-input.error{border-color:var(--color-error)}.form-input.error:focus{box-shadow:0 0 0 3px var(--color-error-alpha-10)}.form-textarea{min-height:120px;resize:vertical;font-family:SF Mono,Monaco,Menlo,Consolas,monospace;font-size:13px;line-height:1.5}.compose-editor{min-height:300px;width:100%}.error-text{color:var(--color-error);font-size:12px;margin-top:4px;display:block}.upload-mode-toggle{display:flex;gap:8px;margin-bottom:16px}.toggle-button{display:flex;align-items:center;gap:8px;padding:8px 16px;background:#4b55634d;border:1px solid var(--color-border);border-radius:6px;color:var(--color-text-secondary);font-size:14px;cursor:pointer;transition:all .2s ease}.toggle-button:hover{background:#4b556380;color:var(--color-text)}.toggle-button.active{background:var(--color-primary-alpha-10);border-color:var(--color-primary-alpha-30);color:var(--color-primary)}.toggle-icon{width:16px;height:16px}.file-upload-area{position:relative}.file-input{position:absolute;opacity:0;width:100%;height:100%;cursor:pointer}.file-upload-label{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 20px;border:2px dashed var(--color-border);border-radius:8px;background:var(--color-surface);cursor:pointer;transition:all .2s ease}.file-upload-label:hover{border-color:var(--color-primary-alpha-30);background:var(--color-primary-alpha-10)}.upload-icon{width:48px;height:48px;color:var(--color-text-secondary);margin-bottom:12px}.upload-text{font-size:16px;font-weight:500;color:var(--color-text);margin-bottom:4px}.upload-subtext{font-size:14px;color:var(--color-text-secondary)}.text-editor-header{display:flex;justify-content:flex-end;margin-bottom:8px}.button.small{padding:6px 12px;font-size:12px}.validation-status{margin-top:16px;margin-bottom:16px}.validation-loading{display:flex;align-items:center;gap:8px;color:var(--color-text-secondary);font-size:14px}.loading-spinner.small{width:16px;height:16px}.validation-result{display:flex;gap:12px;padding:12px;border-radius:8px;font-size:14px}.validation-result.valid{background:var(--color-success-alpha-10);border:1px solid var(--color-success-alpha-30)}.validation-result.invalid{background:var(--color-error-alpha-10);border:1px solid var(--color-error-alpha-30)}.validation-icon{flex-shrink:0;margin-top:2px}.validation-details{flex:1}.validation-text{font-weight:500;margin-bottom:4px}.validation-result.valid .validation-text{color:var(--color-success)}.validation-result.invalid .validation-text{color:var(--color-error)}.validation-errors,.validation-warnings{list-style:none;padding:0;margin:8px 0 0}.validation-errors li{color:var(--color-error-light);margin-bottom:4px;font-size:13px}.validation-warnings li{color:var(--color-warning-light);margin-bottom:4px;font-size:13px}.error-banner{background:var(--color-error-alpha-10);border:1px solid var(--color-error-alpha-30);color:var(--color-error-light);padding:12px 16px;border-radius:8px;margin-bottom:16px;display:flex;align-items:center;gap:8px;font-size:14px}.error-icon{flex-shrink:0;width:16px;height:16px}.error-dismiss{margin-left:auto;width:20px;height:20px;border:none;background:transparent;color:var(--color-error-light);cursor:pointer;border-radius:4px;display:flex;align-items:center;justify-content:center;opacity:.7;transition:opacity .2s ease}.error-dismiss:hover{opacity:1}.modal-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:24px;padding-top:20px;border-top:1px solid var(--color-border)}@media (max-width: 768px){.modal-container{margin:10px;max-width:none;width:calc(100vw - 20px)}.modal-header{padding:20px 20px 0}.modal-body{padding:20px}.modal-title{font-size:18px}.custom-service-header{padding:12px 16px;flex-direction:column;align-items:flex-start;gap:12px}.custom-service-actions{align-self:stretch;justify-content:flex-end}.custom-service-meta{flex-direction:column;align-items:flex-start;gap:4px}.services-grid{gap:6px}.service-tag{font-size:11px}}
