/* Tunnel Watch shared styles: palette and type from the approved v3 mockups. */
:root {
  --red: #d62828;
  --amber: #e69500;
  --green: #2a9d4b;
  --bg: #f4f6f8;
  --ink: #14181d;
  --muted: #66707a;
  --line: #dde2e7;
  --panel: #fff;
  --font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.4;
}
.muted { color: var(--muted); }
.panel { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; padding: 16px; }
.state-down { color: var(--red); }
.state-overdue { color: var(--amber); }
.state-running { color: var(--green); }
button { font-family: inherit; font-size: 1rem; min-height: 44px; }
:focus-visible { outline: 3px solid var(--ink); outline-offset: 2px; }
.sr-only {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}

/* Plain header link between the dashboard and the admin console. */
.nav-link { color: inherit; text-decoration: underline; margin: 0 .6rem; white-space: nowrap; }