:root { font-family: ui-sans-serif, system-ui, sans-serif; color-scheme: light dark; }
body { margin: 0; padding: 2rem; max-width: 880px; margin-inline: auto; }
h1, h2 { font-weight: 600; }
.card { border: 1px solid #8884; border-radius: 8px; padding: 1rem; margin: 1rem 0; }
.btn { padding: 0.5rem 0.9rem; border-radius: 6px; border: 1px solid #8884; cursor: pointer; }
.btn-primary { background: #2563eb; color: white; border-color: #2563eb; }
.stat { display: inline-block; padding: 0.5rem 0.9rem; border: 1px solid #8884; border-radius: 6px; margin: 0.25rem; min-width: 8rem; }
.stat-label { font-size: 0.8rem; opacity: 0.7; }
.stat-value { font-size: 1.4rem; font-weight: 600; }
.badge { padding: 0.1rem 0.5rem; border-radius: 999px; font-size: 0.75rem; }
.badge.up      { background: #16a34a; color: white; }
.badge.down    { background: #dc2626; color: white; }
.badge.unknown { background: #6b7280; color: white; }
.table { width: 100%; border-collapse: collapse; }
.table th, .table td { padding: 0.5rem; border-bottom: 1px solid #8884; text-align: left; }