:root{--color-bg:#fff;--color-bg-subtle:#f8f9fa;--color-bg-card:#fff;--color-border:#e1e4e8;--color-border-subtle:#f0f0f0;--color-text-primary:#1a1a1a;--color-text-secondary:#656d76;--color-text-tertiary:#8b949e;--color-status-operational:#1a7f37;--color-status-operational-bg:#dafbe1;--color-status-degraded:#bf8700;--color-status-degraded-bg:#fff8c5;--color-status-partial:#d1242f;--color-status-partial-bg:#ffebe9;--color-status-major:#cf222e;--color-status-major-bg:#ffcecb;--color-status-maintenance:#8957e5;--color-status-maintenance-bg:#fbefff;--color-link:#0969da;--color-link-hover:#0550ae;--color-accent:#0969da;--color-accent-bg:#ddf4ff;--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;--font-mono:"SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;--radius-sm:4px;--radius-md:6px;--radius-lg:8px;--shadow-sm:0 1px 2px #0969da0d;--shadow-md:0 3px 6px #0969da1a;--shadow-lg:0 10px 15px #0969da1a;font-family:var(--font-sans);color:var(--color-text-primary);background:var(--color-bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-size:14px;line-height:1.5}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--color-bg);margin:0}h1,h2,h3,h4,h5,h6{color:var(--color-text-primary);font-weight:600;line-height:1.25}h1{letter-spacing:-.02em;font-size:24px}h2{letter-spacing:-.01em;font-size:20px}h3{font-size:16px}a{color:var(--color-link);text-decoration:none}a:hover{color:var(--color-link-hover);text-decoration:underline}button{cursor:pointer;font-family:inherit}input,select,textarea{font-family:inherit;font-size:inherit}.app-container{background:var(--color-bg);min-height:100vh}.header{background:var(--color-bg-card);border-bottom:1px solid var(--color-border);z-index:100;justify-content:space-between;align-items:center;padding:16px 24px;display:flex;position:sticky;top:0}.header-left{align-items:center;gap:12px;display:flex}.logo{color:var(--color-text-primary);align-items:center;gap:8px;font-size:16px;font-weight:600;text-decoration:none;display:flex}.logo:hover{text-decoration:none}.logo-icon{width:24px;height:24px;color:var(--color-accent)}.header-status{background:var(--color-status-operational-bg);border-radius:var(--radius-md);color:var(--color-status-operational);align-items:center;gap:8px;padding:6px 12px;font-size:13px;font-weight:500;display:flex}.status-dot{background:currentColor;border-radius:50%;width:8px;height:8px;animation:2s infinite pulse}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.header-right{align-items:center;gap:16px;display:flex}.user-info{color:var(--color-text-secondary);font-size:13px}.btn-logout{color:var(--color-text-secondary);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;background:0 0;align-items:center;gap:6px;padding:6px 12px;font-size:13px;font-weight:500;transition:all .15s;display:flex}.btn-logout:hover{background:var(--color-bg-subtle);border-color:var(--color-text-tertiary);color:var(--color-text-primary)}.btn-icon{cursor:pointer;border-radius:var(--radius-md);color:var(--color-text-secondary);background:0 0;border:none;align-items:center;padding:8px;transition:all .15s;display:flex}.btn-icon:hover{background:var(--color-bg-subtle)}.main-layout{min-height:calc(100vh - 65px);display:flex}.sidebar{background:var(--color-bg-card);border-right:1px solid var(--color-border);flex-shrink:0;width:280px;padding:24px 0;overflow-y:auto}.sidebar-section{margin-bottom:24px;padding:0 16px}.sidebar-title{text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-tertiary);margin-bottom:8px;padding:0 16px;font-size:11px;font-weight:600}.sidebar-nav{flex-direction:column;gap:2px;display:flex}.sidebar-link{color:var(--color-text-secondary);border-radius:var(--radius-md);justify-content:space-between;align-items:center;padding:8px 16px;font-size:14px;font-weight:500;text-decoration:none;transition:all .15s;display:flex}.sidebar-link:hover{background:var(--color-bg-subtle);color:var(--color-text-primary);text-decoration:none}.sidebar-link.active{background:var(--color-accent-bg);color:var(--color-accent)}.sidebar-env{color:var(--color-text-tertiary);background:var(--color-bg-subtle);border-radius:var(--radius-sm);padding:2px 6px;font-size:11px;font-weight:400}.sidebar-empty{color:var(--color-text-tertiary);text-align:center;padding:16px;font-size:13px}.content{flex:1;max-width:1200px;padding:32px 40px;overflow-x:hidden}.status-banner{background:var(--color-status-operational-bg);border:1px solid var(--color-status-operational);border-radius:var(--radius-lg);justify-content:space-between;align-items:center;margin-bottom:32px;padding:20px 24px;display:flex}.status-banner-content{align-items:center;gap:12px;display:flex}.status-banner-icon{width:20px;height:20px;color:var(--color-status-operational)}.status-banner-text{color:var(--color-status-operational);font-size:16px;font-weight:600}.status-banner-subtext{color:var(--color-text-secondary);margin-top:4px;font-size:13px}.uptime-link{font-size:13px;font-weight:500}.services-grid{grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;margin-bottom:40px;display:grid}.service-card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:20px;transition:all .15s}.service-card:hover{border-color:var(--color-text-tertiary);box-shadow:var(--shadow-md)}.service-card-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.service-card-name{color:var(--color-text-primary);align-items:center;gap:8px;font-size:15px;font-weight:600;display:flex}.service-card-status{border-radius:var(--radius-sm);align-items:center;gap:6px;padding:4px 10px;font-size:12px;font-weight:500;display:flex}.status-operational{background:var(--color-status-operational-bg);color:var(--color-status-operational)}.status-degraded{background:var(--color-status-degraded-bg);color:var(--color-status-degraded)}.status-partial{background:var(--color-status-partial-bg);color:var(--color-status-partial)}.status-major{background:var(--color-status-major-bg);color:var(--color-status-major)}.status-unknown{background:var(--color-bg-subtle);color:var(--color-text-tertiary)}.service-card-details{flex-direction:column;gap:8px;display:flex}.service-card-detail{justify-content:space-between;font-size:13px;display:flex}.service-card-label{color:var(--color-text-secondary)}.service-card-value{color:var(--color-text-primary);font-weight:500;font-family:var(--font-mono);font-size:12px}.section-header{border-bottom:1px solid var(--color-border-subtle);justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:12px;display:flex}.section-title{color:var(--color-text-primary);font-size:18px;font-weight:600}.section-subtitle{color:var(--color-text-secondary);margin-top:4px;font-size:13px}.incident-list{flex-direction:column;gap:24px;display:flex}.incident-date{color:var(--color-text-primary);margin-bottom:12px;font-size:14px;font-weight:600}.incident-item{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:16px 20px;transition:all .15s}.incident-item:hover{border-color:var(--color-text-tertiary)}.incident-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.incident-title{color:var(--color-text-primary);font-size:15px;font-weight:600}.incident-status{border-radius:var(--radius-sm);align-items:center;gap:6px;padding:4px 10px;font-size:12px;font-weight:500;display:flex}.incident-updates{border-left:2px solid var(--color-border-subtle);flex-direction:column;gap:12px;padding-left:16px;display:flex}.incident-update{flex-direction:column;gap:4px;display:flex}.incident-update-status{color:var(--color-text-primary);font-size:13px;font-weight:600}.incident-update-time{color:var(--color-text-tertiary);font-size:12px}.incident-update-text{color:var(--color-text-secondary);font-size:13px;line-height:1.5}.metrics-table{border-collapse:collapse;width:100%;margin-top:16px;font-size:13px}.metrics-table th{text-align:left;color:var(--color-text-secondary);border-bottom:1px solid var(--color-border);text-transform:uppercase;letter-spacing:.03em;padding:10px 12px;font-size:12px;font-weight:600}.metrics-table td{border-bottom:1px solid var(--color-border-subtle);color:var(--color-text-primary);padding:10px 12px}.metrics-table tr:last-child td{border-bottom:none}.metrics-table tr:hover td{background:var(--color-bg-subtle)}.metrics-table-value{font-family:var(--font-mono);font-size:12px}.history-table{border-collapse:collapse;width:100%;margin-top:16px;font-size:13px}.history-table th{text-align:left;color:var(--color-text-secondary);border-bottom:1px solid var(--color-border);text-transform:uppercase;letter-spacing:.03em;padding:10px 12px;font-size:12px;font-weight:600}.history-table td{border-bottom:1px solid var(--color-border-subtle);color:var(--color-text-primary);padding:10px 12px}.history-table tr:last-child td{border-bottom:none}.history-table tr:hover td{background:var(--color-bg-subtle)}.history-table-link{color:var(--color-link);cursor:pointer}.history-table-link:hover{text-decoration:underline}.status-badge{border-radius:var(--radius-sm);align-items:center;gap:6px;padding:4px 10px;font-size:12px;font-weight:500;display:inline-flex}.status-badge-dot{background:currentColor;border-radius:50%;width:6px;height:6px}.skeleton{background:linear-gradient(90deg, var(--color-bg-subtle) 25%, var(--color-border-subtle) 50%, var(--color-bg-subtle) 75%);border-radius:var(--radius-md);background-size:200% 100%;animation:1.5s infinite skeleton-loading}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.empty-state{text-align:center;color:var(--color-text-tertiary);padding:60px 20px}.empty-state-icon{opacity:.5;width:48px;height:48px;margin:0 auto 16px}.empty-state-title{color:var(--color-text-secondary);margin-bottom:8px;font-size:16px;font-weight:600}.empty-state-text{max-width:400px;margin:0 auto;font-size:14px}.error-state{background:var(--color-status-partial-bg);border:1px solid var(--color-status-partial);border-radius:var(--radius-lg);color:var(--color-status-partial);padding:20px 24px;font-size:14px}.login-container{background:var(--color-bg-subtle);justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.login-card{background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);width:100%;max-width:400px;box-shadow:var(--shadow-lg);padding:40px}.login-header{text-align:center;margin-bottom:32px}.login-logo{width:48px;height:48px;color:var(--color-accent);margin:0 auto 16px}.login-title{color:var(--color-text-primary);margin-bottom:8px;font-size:24px;font-weight:600}.login-subtitle{color:var(--color-text-secondary);font-size:14px}.login-form{flex-direction:column;gap:16px;display:flex}.form-group{flex-direction:column;gap:6px;display:flex}.form-label{color:var(--color-text-secondary);font-size:13px;font-weight:500}.form-input{border:1px solid var(--color-border);border-radius:var(--radius-md);outline:none;padding:10px 12px;font-size:14px;transition:all .15s}.form-input:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px var(--color-accent-bg)}.form-input::placeholder{color:var(--color-text-tertiary)}.btn-primary{color:#fff;background:var(--color-accent);border-radius:var(--radius-md);cursor:pointer;border:none;padding:10px 16px;font-size:14px;font-weight:600;transition:all .15s}.btn-primary:hover{background:var(--color-link-hover)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.login-error{background:var(--color-status-partial-bg);border:1px solid var(--color-status-partial);border-radius:var(--radius-md);color:var(--color-status-partial);padding:12px 16px;font-size:13px}.env-selector{background:var(--color-bg-subtle);border:1px solid var(--color-border);border-radius:var(--radius-md);color:var(--color-text-secondary);align-items:center;gap:8px;padding:6px 12px;font-size:13px;display:flex}.env-selector-select{color:var(--color-text-primary);cursor:pointer;background:0 0;border:none;outline:none;font-size:13px;font-weight:500}.env-selector-select:focus{outline:none}@media (width<=1024px){.sidebar{width:240px}.content{padding:24px 20px}.services-grid{grid-template-columns:1fr}}@media (width<=768px){.main-layout{flex-direction:column}.sidebar{border-right:none;border-bottom:1px solid var(--color-border);width:100%;padding:16px 0}.sidebar-section{padding:0}.content{padding:20px 16px}.header{padding:12px 16px}}