:root{color-scheme:dark;--bg: #14161a;--panel: #1d2025;--panel-border: #2a2e35;--text: #e4e6eb;--text-dim: #8b909a;--green: #35c96b;--yellow: #e3b341;--red: #f0533d;--gray: #6b7280;--accent: #4f8cff}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}#app{max-width:1200px;margin:0 auto;padding:24px 16px 64px}h1{font-size:1.4rem;font-weight:600;margin:0 0 20px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}.card{background:var(--panel);border:1px solid var(--panel-border);border-radius:10px;padding:16px;cursor:pointer;transition:border-color .15s ease}.card:hover{border-color:var(--accent)}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.card-title{font-weight:600;font-size:1rem}.status-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}.status-ok{background:var(--green)}.status-warning{background:var(--yellow)}.status-critical{background:var(--red)}.status-offline{background:var(--gray)}.metric-row{margin-bottom:8px}.metric-label{display:flex;justify-content:space-between;font-size:.78rem;color:var(--text-dim);margin-bottom:3px}.progress-track{height:6px;border-radius:3px;background:#2a2e35;overflow:hidden}.progress-fill{height:100%;border-radius:3px;background:var(--accent)}.progress-fill.warn{background:var(--yellow)}.progress-fill.crit{background:var(--red)}.last-seen{font-size:.75rem;color:var(--text-dim);margin-top:10px}.services{margin-top:10px;display:flex;flex-wrap:wrap;gap:6px}.service-pill{font-size:.7rem;padding:2px 8px;border-radius:12px;background:#262a31;color:var(--text-dim)}.service-pill.running,.service-pill.active,.service-pill.healthy{color:var(--green)}.service-pill.failed,.service-pill.unhealthy,.service-pill.exited{color:var(--red)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:10}.modal{background:var(--panel);border:1px solid var(--panel-border);border-radius:10px;padding:20px;width:min(800px,92vw);max-height:85vh;overflow-y:auto}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.range-toggle button{background:#262a31;border:1px solid var(--panel-border);color:var(--text-dim);padding:4px 12px;font-size:.8rem;cursor:pointer}.range-toggle button.active{color:var(--text);border-color:var(--accent)}.range-toggle button:first-child{border-radius:6px 0 0 6px}.range-toggle button:last-child{border-radius:0 6px 6px 0}.close-btn{background:none;border:none;color:var(--text-dim);font-size:1.2rem;cursor:pointer}.empty-state{color:var(--text-dim);padding:40px;text-align:center}