:root{--bg-base:#0a0e14;--bg-surface:#111824;--bg-elevated:#16202e;--bg-input:#0d131b;--bg-hover:#1c2838;--text-primary:#d5dde8;--text-secondary:#8a98ad;--text-muted:#5a6577;--text-on-accent:#0a0e14;--accent:#e8a838;--accent-hover:#f0b855;--accent-muted:#8a6420;--health-healthy:#4ade80;--health-degraded:#fbbf24;--health-down:#f87171;--health-unknown:#6b7280;--status-pending:#fbbf24;--status-running:#60a5fa;--status-completed:#4ade80;--status-failed:#f87171;--status-cancelled:#6b7280;--border-default:#243245;--border-strong:#344658;--border-focus:#e8a838;--space-xs:.25rem;--space-sm:.5rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2.5rem;--radius-sm:3px;--radius-md:6px;--radius-lg:10px;--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono:"SF Mono", SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--font-size-xs:.75rem;--font-size-sm:.8125rem;--font-size-base:.875rem;--font-size-md:1rem;--font-size-lg:1.25rem;--font-size-xl:1.75rem;--transition-fast:.12s ease-out;--transition-base:.2s ease-out;--nav-width:240px;--header-height:56px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;font-size:16px}body{font-family:var(--font-sans);font-size:var(--font-size-base);color:var(--text-primary);background:var(--bg-base);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5}#root{min-height:100vh}.skip-link{z-index:1000;padding:var(--space-sm) var(--space-md);background:var(--accent);color:var(--text-on-accent);border-radius:0 0 var(--radius-sm) 0;font-weight:600;text-decoration:none;position:absolute;top:-100px;left:0}.skip-link:focus{top:0}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--border-focus);outline-offset:2px;border-radius:var(--radius-sm)}.app-layout{min-height:100vh;display:flex}.app-nav{width:var(--nav-width);background:var(--bg-surface);border-right:1px solid var(--border-default);z-index:100;flex-direction:column;flex-shrink:0;display:flex;position:fixed;top:0;bottom:0;left:0;overflow-y:auto}.app-nav__brand{padding:var(--space-md) var(--space-lg);font-size:var(--font-size-lg);color:var(--accent);border-bottom:1px solid var(--border-default);letter-spacing:.03em;text-transform:uppercase;font-weight:700;font-family:var(--font-mono)}.app-nav__section-label{padding:var(--space-md) var(--space-lg) var(--space-xs);font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);font-weight:600}.app-nav__list{padding:0 var(--space-sm);flex-direction:column;gap:1px;list-style:none;display:flex}.app-nav__link{align-items:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);color:var(--text-secondary);font-size:var(--font-size-sm);border-radius:var(--radius-sm);transition:background var(--transition-fast), color var(--transition-fast);border-left:2px solid #0000;text-decoration:none;display:flex}.app-nav__link:hover{background:var(--bg-hover);color:var(--text-primary)}.app-nav__link[aria-current=page]{background:var(--bg-elevated);color:var(--accent);border-left-color:var(--accent);font-weight:500}.app-nav__link-icon{text-align:center;width:16px;font-family:var(--font-mono);font-size:var(--font-size-sm);flex-shrink:0}.app-nav__spacer{flex:1}.app-nav__footer{padding:var(--space-md) var(--space-lg);font-size:var(--font-size-xs);color:var(--text-muted);border-top:1px solid var(--border-default)}.app-main{margin-left:var(--nav-width);flex-direction:column;flex:1;min-height:100vh;display:flex}.app-header{height:var(--header-height);align-items:center;gap:var(--space-md);padding:0 var(--space-xl);background:var(--bg-surface);border-bottom:1px solid var(--border-default);display:flex}.app-header__title{font-size:var(--font-size-md);font-weight:600}.app-header__spacer{flex:1}.app-content{padding:var(--space-xl);flex:1}.nav-toggle{background:var(--bg-elevated);border:1px solid var(--border-default);color:var(--text-primary);border-radius:var(--radius-sm);cursor:pointer;width:36px;height:36px;font-size:var(--font-size-md);flex-shrink:0;justify-content:center;align-items:center;display:none}.nav-overlay{z-index:99;background:#0009;display:none;position:fixed;inset:0}@media (width<=768px){.nav-toggle{top:var(--space-sm);left:var(--space-sm);z-index:101;margin-top:calc((var(--header-height) - 36px) / 2 - var(--space-sm));display:flex;position:fixed}.nav-overlay.active{display:block}.app-nav{transition:transform var(--transition-base);transform:translate(-100%);box-shadow:4px 0 24px #0006}.app-nav.open{transform:translate(0)}.app-main{min-width:0;margin-left:0}.app-header{padding-left:calc(36px + var(--space-md) + var(--space-sm))}.app-content{padding:var(--space-md);min-width:0;overflow-x:hidden}}.card{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-md);padding:var(--space-lg)}.card__header{margin-bottom:var(--space-md);justify-content:space-between;align-items:center;display:flex}.card__title{font-size:var(--font-size-md);font-weight:600}.card__subtitle{font-size:var(--font-size-sm);color:var(--text-secondary);margin-top:var(--space-xs)}.grid{gap:var(--space-md);display:grid}.grid--2{grid-template-columns:repeat(2,1fr)}.grid--3{grid-template-columns:repeat(3,1fr)}.grid--4{grid-template-columns:repeat(4,1fr)}@media (width<=1024px){.grid--3,.grid--4{grid-template-columns:repeat(2,1fr)}}@media (width<=640px){.grid--2,.grid--3,.grid--4{grid-template-columns:1fr}}.health-badge{align-items:center;gap:var(--space-xs);padding:2px var(--space-sm);border-radius:var(--radius-sm);font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.04em;font-weight:600;display:inline-flex}.health-badge--healthy{color:var(--health-healthy);background:#4ade801f}.health-badge--degraded{color:var(--health-degraded);background:#fbbf241f}.health-badge--down{color:var(--health-down);background:#f871711f}.health-badge--unknown{color:var(--health-unknown);background:#6b72801f}.health-badge__dot{background:currentColor;border-radius:50%;width:6px;height:6px}.status-pill{align-items:center;gap:var(--space-xs);padding:2px var(--space-sm);font-size:var(--font-size-xs);border:1px solid var(--border-default);border-radius:99px;font-weight:500;display:inline-flex}.status-pill--pending{color:var(--status-pending);border-color:#fbbf244d}.status-pill--running{color:var(--status-running);border-color:#60a5fa4d}.status-pill--completed{color:var(--status-completed);border-color:#4ade804d}.status-pill--failed{color:var(--status-failed);border-color:#f871714d}.status-pill--cancelled{color:var(--status-cancelled);border-color:#6b72804d}.cost{font-family:var(--font-mono);font-size:var(--font-size-sm);color:var(--text-secondary)}.cost--high{color:var(--health-down)}.cost--medium{color:var(--health-degraded)}.table-wrap{border-radius:var(--radius-md);border:1px solid var(--border-default);overflow-x:auto}.table{border-collapse:collapse;width:100%;font-size:var(--font-size-sm)}.table th{text-align:left;padding:var(--space-sm) var(--space-md);background:var(--bg-elevated);font-weight:600;font-size:var(--font-size-xs);text-transform:uppercase;letter-spacing:.04em;color:var(--text-secondary);white-space:nowrap;border-bottom:1px solid var(--border-default)}.table td{padding:var(--space-sm) var(--space-md);border-bottom:1px solid var(--border-default);vertical-align:top}.table tbody tr:hover{background:var(--bg-hover)}.table tbody tr:last-child td{border-bottom:none}.table td,.table td .mono,.card .mono{overflow-wrap:anywhere}.form-help{font-size:var(--font-size-xs);color:var(--text-muted);margin-top:var(--space-xs)}.stage-card{background:var(--bg-surface);border:1px solid var(--border-default);border-radius:var(--radius-md);padding:var(--space-md);gap:var(--space-sm);flex-direction:column;display:flex}.stage-card__header{justify-content:space-between;align-items:center;display:flex}.stage-card__name{font-weight:600;font-size:var(--font-size-sm)}.stage-card__desc{font-size:var(--font-size-xs);color:var(--text-secondary)}.stage-card__progress{background:var(--bg-input);border-radius:99px;height:3px;overflow:hidden}.stage-card__progress-bar{height:100%;transition:width var(--transition-base);border-radius:99px}.approval-card{background:var(--bg-surface);border:1px solid var(--border-default);border-left:3px solid var(--status-pending);border-radius:var(--radius-md);padding:var(--space-md);gap:var(--space-sm);flex-direction:column;display:flex}.approval-card__title{font-weight:600;font-size:var(--font-size-sm)}.approval-card__body{font-size:var(--font-size-xs);color:var(--text-secondary)}.approval-card__actions{gap:var(--space-sm);display:flex}.btn{justify-content:center;align-items:center;gap:var(--space-xs);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-sm);font-size:var(--font-size-sm);cursor:pointer;transition:background var(--transition-fast), border-color var(--transition-fast);white-space:nowrap;border:1px solid #0000;font-family:inherit;font-weight:500;text-decoration:none;display:inline-flex}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--primary{background:var(--accent);color:var(--text-on-accent)}.btn--primary:hover:not(:disabled){background:var(--accent-hover)}.btn--secondary{background:var(--bg-elevated);color:var(--text-primary);border-color:var(--border-default)}.btn--secondary:hover:not(:disabled){background:var(--bg-hover)}.btn--danger{color:var(--status-failed);background:#f871711a;border-color:#f871714d}.btn--danger:hover:not(:disabled){background:#f8717133}.btn--ghost{color:var(--text-secondary);background:0 0}.btn--ghost:hover:not(:disabled){color:var(--text-primary);background:var(--bg-hover)}.btn--sm{padding:var(--space-xs) var(--space-sm);font-size:var(--font-size-xs)}.state{padding:var(--space-xl) var(--space-lg);text-align:center;justify-content:center;align-items:center;gap:var(--space-sm);flex-direction:column;display:flex}.state__icon{color:var(--text-muted);font-size:2rem;font-family:var(--font-mono)}.state__title{font-size:var(--font-size-md);color:var(--text-secondary);font-weight:600}.state__desc{font-size:var(--font-size-sm);color:var(--text-muted);max-width:400px}.loading{align-items:center;gap:var(--space-sm);color:var(--text-secondary);font-size:var(--font-size-sm);display:flex}.loading__spinner{border:2px solid var(--border-default);border-top-color:var(--accent);border-radius:50%;width:16px;height:16px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.error-banner{align-items:flex-start;gap:var(--space-sm);padding:var(--space-md);border-radius:var(--radius-md);color:var(--status-failed);font-size:var(--font-size-sm);background:#f8717114;border:1px solid #f8717133;display:flex}.error-banner__code{font-family:var(--font-mono);font-size:var(--font-size-xs);color:var(--text-muted);margin-top:var(--space-xs)}.form-field{gap:var(--space-xs);margin-bottom:var(--space-md);flex-direction:column;display:flex}.form-label{font-size:var(--font-size-sm);color:var(--text-secondary);font-weight:500}.form-input,.form-select,.form-textarea{padding:var(--space-sm) var(--space-md);background:var(--bg-input);border:1px solid var(--border-default);border-radius:var(--radius-sm);color:var(--text-primary);font-size:var(--font-size-sm);font-family:inherit}.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--accent)}.secret-ref{align-items:center;gap:var(--space-xs);font-family:var(--font-mono);font-size:var(--font-size-xs);padding:2px var(--space-sm);background:var(--bg-input);border:1px solid var(--border-default);border-radius:var(--radius-sm);color:var(--text-secondary);display:inline-flex}.secret-ref__icon{color:var(--accent-muted)}.mono{font-family:var(--font-mono);font-size:var(--font-size-sm)}.text-muted{color:var(--text-muted)}.text-secondary{color:var(--text-secondary)}.page-title{font-size:var(--font-size-xl);margin-bottom:var(--space-xs);font-weight:700}.page-subtitle{font-size:var(--font-size-sm);color:var(--text-secondary);margin-bottom:var(--space-lg)}.flex-row{align-items:center;gap:var(--space-sm);display:flex}.flex-col{gap:var(--space-sm);flex-direction:column;display:flex}.gap-md{gap:var(--space-md)}.mt-md{margin-top:var(--space-md)}.mt-lg{margin-top:var(--space-lg)}.mb-md{margin-bottom:var(--space-md)}.mb-lg{margin-bottom:var(--space-lg)}.card-list{gap:var(--space-sm);flex-direction:column;display:none}@media (width<=640px){.table-desktop{display:none}.card-list{display:flex}}.sse-indicator{align-items:center;gap:var(--space-xs);font-size:var(--font-size-xs);padding:2px var(--space-sm);border-radius:var(--radius-sm);display:inline-flex}.sse-indicator--connected{color:var(--health-healthy)}.sse-indicator--connecting{color:var(--health-degraded)}.sse-indicator--error{color:var(--health-down)}.sse-indicator__dot{background:currentColor;border-radius:50%;width:6px;height:6px;animation:2s ease-in-out infinite pulse-dot}@keyframes pulse-dot{0%,to{opacity:1}50%{opacity:.3}}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-base)}::-webkit-scrollbar-thumb{background:var(--border-default);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--border-strong)}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}