* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { margin: 0; height: 100%; background: #0b0d10; color: #e6e8eb; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif; font-size: 14px; word-break: keep-all; }
button, select, input { font: inherit; }
button { cursor: pointer; border: 1px solid #2c333c; background: #171b21; color: #e6e8eb; border-radius: 8px; padding: 8px 12px; min-height: 40px; }
button:hover { background: #20262e; }
button:disabled { opacity: .5; cursor: default; }
button.primary { background: #1f6feb; border-color: #1f6feb; color: #fff; font-weight: 600; }
button.primary:hover { background: #2b7bff; }
button.danger { background: #b42318; border-color: #b42318; color: #fff; }
select { background: #171b21; color: #e6e8eb; border: 1px solid #2c333c; border-radius: 8px; padding: 8px 10px; min-height: 40px; }
.pill { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: rgba(0,0,0,.55); border: 1px solid rgba(255,255,255,.12); font-size: 13px; font-weight: 600; backdrop-filter: blur(6px); }
.pill .dot { width: 8px; height: 8px; border-radius: 50%; background: #6b7280; }
.pill.live .dot { background: #22c55e; box-shadow: 0 0 8px #22c55e; }
.pill.warn .dot { background: #f59e0b; }
.pill.bad .dot { background: #ef4444; }
.mono { font-family: ui-monospace, Menlo, Consolas, monospace; font-variant-numeric: tabular-nums; }
.muted { color: #9aa4b2; }