:root{--color-bg: #0b0d12;--color-surface: #12151c;--color-surface-raised: #171b23;--color-surface-hover: #1c212b;--color-border: #23262e;--color-border-strong: #333947;--color-text: #e8eaee;--color-text-muted: #96a0ad;--color-text-faint: #626a77;--color-primary: #3b82f6;--color-primary-hover: #2f6fe0;--color-primary-text: #ffffff;--color-success: #22c55e;--color-success-bg: rgba(34, 197, 94, .12);--color-danger: #f0554b;--color-danger-bg: rgba(240, 85, 75, .12);--color-warning: #f5a524;--color-warning-bg: rgba(245, 165, 36, .12);--color-unknown: #6b7280;--color-unknown-bg: rgba(107, 114, 128, .14);--font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: ui-monospace, "SF Mono", "Cascadia Code", Menlo, Consolas, monospace;--text-xs: .75rem;--text-sm: .8125rem;--text-base: .9375rem;--text-md: 1.0625rem;--text-lg: 1.3125rem;--text-xl: 1.625rem;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.5rem;--space-6: 2rem;--space-7: 3rem;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;color-scheme:dark}:root[data-theme=light]{--color-bg: #f5f6f8;--color-surface: #ffffff;--color-surface-raised: #ffffff;--color-surface-hover: #f0f2f5;--color-border: #e1e4ea;--color-border-strong: #c7cdd6;--color-text: #14171c;--color-text-muted: #565f6d;--color-text-faint: #7a8290;--color-primary: #1d4ed8;--color-primary-hover: #1e40af;--color-primary-text: #ffffff;--color-success: #15803d;--color-success-bg: rgba(21, 128, 61, .1);--color-danger: #b91c1c;--color-danger-bg: rgba(185, 28, 28, .08);--color-warning: #b45309;--color-warning-bg: rgba(180, 83, 9, .1);--color-unknown: #4b5563;--color-unknown-bg: rgba(75, 85, 99, .1);color-scheme:light}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:var(--font-sans);font-size:var(--text-base);line-height:1.5;background:var(--color-bg);color:var(--color-text);-webkit-font-smoothing:antialiased;transition:background-color .15s ease,color .15s ease}h1,h2,h3,h4{font-weight:600;line-height:1.3;margin:0 0 var(--space-2);letter-spacing:-.01em}h2{font-size:var(--text-xl)}h3{font-size:var(--text-lg)}h4{font-size:var(--text-md);margin-top:var(--space-4)}p{margin:0 0 var(--space-2)}a{color:var(--color-primary);text-decoration:none}a:hover{text-decoration:underline}::selection{background:var(--color-primary);color:#fff}:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px;border-radius:var(--radius-sm)}.nav{display:flex;gap:var(--space-5);align-items:center;padding:var(--space-4) var(--space-6);border-bottom:1px solid var(--color-border);background:var(--color-surface);position:sticky;top:0;z-index:10}.nav .brand{font-weight:700;font-size:var(--text-md);letter-spacing:-.01em;margin-right:var(--space-2)}.nav a{color:var(--color-text-muted);text-decoration:none;font-weight:500;font-size:var(--text-sm);padding:var(--space-2) 0;border-bottom:2px solid transparent}.nav a:hover{color:var(--color-text)}.nav a.active{color:var(--color-text);border-bottom-color:var(--color-primary)}.container{padding:var(--space-6);max-width:1180px;margin:0 auto}.page-header{margin-bottom:var(--space-6)}.page-header h2{margin-bottom:var(--space-1)}.page-header .page-meta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-3);margin-top:var(--space-2)}.section{margin-top:var(--space-7)}.section:first-of-type{margin-top:var(--space-6)}.section-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);border-bottom:1px solid var(--color-border);padding-bottom:var(--space-2);margin-bottom:var(--space-4)}.section-header h3{margin:0}.section-header-actions{display:flex;align-items:center;gap:var(--space-2)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-4)}.card{background:var(--color-surface-raised);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-5);transition:border-color .15s ease,background .15s ease}a.card-link{display:block;color:inherit;text-decoration:none}a.card-link:hover .card,a.card-link:focus-visible .card{border-color:var(--color-border-strong);background:var(--color-surface-hover)}.card h3{margin:0 0 var(--space-1);font-size:var(--text-md)}.card-desc{color:var(--color-text-muted);font-size:var(--text-sm);margin:0 0 var(--space-3);min-height:1.2em}.card-footer{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-3);align-items:center}.tag{display:inline-flex;align-items:center;background:var(--color-surface);border:1px solid var(--color-border);color:var(--color-text-muted);border-radius:var(--radius-sm);padding:.15rem .55rem;font-size:var(--text-xs);font-family:var(--font-mono);margin:.15rem .35rem 0 0}.pill{display:inline-flex;align-items:center;gap:.35rem;font-size:var(--text-xs);font-weight:600;padding:.2rem .55rem;border-radius:999px}.pill.success{background:var(--color-success-bg);color:var(--color-success)}.pill.danger{background:var(--color-danger-bg);color:var(--color-danger)}.pill.warning{background:var(--color-warning-bg);color:var(--color-warning)}.pill.unknown{background:var(--color-unknown-bg);color:var(--color-unknown)}.badge{display:inline-flex;align-items:center;gap:.4rem;font-size:var(--text-sm);margin-right:var(--space-4);color:var(--color-text-muted)}.dot{width:8px;height:8px;border-radius:50%;display:inline-block;flex:none}.dot.ok,.dot.online{background:var(--color-success);box-shadow:0 0 0 3px var(--color-success-bg)}.dot.bad,.dot.offline{background:var(--color-danger);box-shadow:0 0 0 3px var(--color-danger-bg)}.dot.unknown{background:var(--color-unknown);box-shadow:0 0 0 3px var(--color-unknown-bg)}.health-label{display:inline-flex;align-items:center;gap:.4rem}.health-label.online,.health-label.ok{color:var(--color-success)}.health-label.offline,.health-label.bad{color:var(--color-danger)}.health-label.unknown{color:var(--color-unknown)}table{width:100%;border-collapse:collapse;margin-top:var(--space-3);font-variant-numeric:tabular-nums}th,td{text-align:left;padding:var(--space-3) var(--space-3);border-bottom:1px solid var(--color-border);font-size:var(--text-sm)}th{color:var(--color-text-faint);font-weight:600;text-transform:uppercase;font-size:var(--text-xs);letter-spacing:.04em}tbody tr:hover{background:var(--color-surface)}td:first-child,th:first-child{padding-left:0}td:last-child,th:last-child{padding-right:0}.mono{font-family:var(--font-mono);font-size:var(--text-sm)}label{display:block;font-size:var(--text-sm);color:var(--color-text-muted);margin-bottom:var(--space-1);font-weight:500}input,textarea,select,button{font-family:inherit;font-size:var(--text-sm);background:var(--color-surface-raised);color:var(--color-text);border:1px solid var(--color-border-strong);border-radius:var(--radius-sm);padding:.55rem .7rem}input,textarea,select{width:100%;transition:border-color .15s ease}input:focus,textarea:focus,select:focus{border-color:var(--color-primary)}textarea{resize:vertical;min-height:4.5rem}button{cursor:pointer;background:var(--color-primary);border-color:var(--color-primary);color:var(--color-primary-text);font-weight:600;padding:.55rem 1rem;transition:background .15s ease,border-color .15s ease,opacity .15s ease}button:hover:not(:disabled){background:var(--color-primary-hover);border-color:var(--color-primary-hover)}button:disabled{opacity:.5;cursor:not-allowed}button.secondary{background:transparent;border-color:var(--color-border-strong);color:var(--color-text)}button.secondary:hover:not(:disabled){background:var(--color-surface-hover);border-color:var(--color-text-faint)}button.danger{background:transparent;border-color:var(--color-danger);color:var(--color-danger)}button.danger:hover:not(:disabled){background:var(--color-danger-bg)}button.small{padding:.35rem .7rem;font-size:var(--text-xs)}button.icon-button{display:inline-flex;align-items:center;justify-content:center;padding:.45rem;width:30px;height:30px}.form-row{display:flex;flex-direction:column;gap:var(--space-1);margin-bottom:var(--space-4)}.form-hint{color:var(--color-text-faint);font-size:var(--text-xs)}.form-actions{display:flex;align-items:center;gap:var(--space-3);margin-top:var(--space-4)}.input-with-action{position:relative;display:flex;align-items:center}.input-with-action input{padding-right:3.6rem}.input-with-action button{position:absolute;right:4px;padding:.3rem .6rem;font-size:var(--text-xs);background:transparent;border:none;color:var(--color-text-muted)}.input-with-action button:hover:not(:disabled){background:var(--color-surface-hover);color:var(--color-text)}details>summary{cursor:pointer;color:var(--color-text-muted);font-size:var(--text-sm)}details>summary:hover{color:var(--color-text)}details[open]>summary{margin-bottom:var(--space-2)}.muted{color:var(--color-text-muted);font-size:var(--text-sm)}.faint{color:var(--color-text-faint);font-size:var(--text-xs)}.error{color:var(--color-danger);font-size:var(--text-sm)}.error-banner{background:var(--color-danger-bg);border:1px solid var(--color-danger);color:var(--color-danger);border-radius:var(--radius-sm);padding:var(--space-3) var(--space-4);font-size:var(--text-sm);margin-bottom:var(--space-4)}.empty-state{border:1px dashed var(--color-border-strong);border-radius:var(--radius-md);padding:var(--space-6);text-align:center;color:var(--color-text-muted)}.empty-state p{margin-bottom:var(--space-3)}.loading-state{color:var(--color-text-muted);font-size:var(--text-sm);padding:var(--space-4) 0}.skeleton{background:linear-gradient(90deg,var(--color-surface-raised) 25%,var(--color-surface-hover) 37%,var(--color-surface-raised) 63%);background-size:400% 100%;animation:skeleton-loading 1.4s ease infinite;border-radius:var(--radius-sm)}@keyframes skeleton-loading{0%{background-position:100% 50%}to{background-position:0 50%}}.skeleton-card{height:108px}@media(prefers-reduced-motion:reduce){.skeleton{animation:none}*{transition:none!important}}.avatar{width:40px;height:40px;border-radius:50%;background:var(--color-surface);border:1px solid var(--color-border-strong);display:inline-flex;align-items:center;justify-content:center;font-weight:700;font-size:var(--text-sm);color:var(--color-text-muted);flex:none}.card-heading{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-2)}.card-heading h3{margin:0}@media(max-width:640px){.container{padding:var(--space-4)}.nav{padding:var(--space-3) var(--space-4);flex-wrap:wrap;gap:var(--space-3)}}
