/* Reset + shared tokens */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; height: 100%; }
body {
  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
:root {
  --mono: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace;
  /* Yunex Traffic uses Open Sans (body) and Roboto. Both are loaded from
     Google Fonts when reachable; the chain falls back to the system UI font
     silently if the office network blocks it, so nothing breaks. */
  --brand-font: 'Open Sans', Roboto, system-ui, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
  --brand-mono: 'Roboto Mono', var(--mono);
}
button { font: inherit; cursor: pointer; }
a { color: inherit; }
code { font-family: var(--mono); }

/* Shared bits */
.pill {
  font-size: 0.7em; letter-spacing: 0.12em; text-transform: uppercase;
  padding: 0.15em 0.6em; border-radius: 999px;
  border: 1px solid currentColor; opacity: 0.85;
}
.dot { display: inline-block; width: 0.6em; height: 0.6em; border-radius: 50%; vertical-align: middle; }
.dot.ok { background: #2ecc71; box-shadow: 0 0 6px #2ecc71; }
.dot.warn { background: #f1c40f; box-shadow: 0 0 6px #f1c40f; }
.dot.buf { background: #6ea8fe; box-shadow: 0 0 6px #6ea8fe; }