/* Logrrr brand tokens, shared by logrrr.com and app.logrrr.com.
   Source: the design team's app.css (2026-10-02). Dark only for v1.
   Series colors are a fixed order, never cycled; status colors always come
   with an icon or label, never color alone. */
:root {
  --bg: #060a14;
  --bg-raised: #0b101c;
  --panel: #0f1422;
  --panel-2: #141b2c;
  --border: #232b40;
  --border-soft: #1a2032;
  --text: #e8ecf3;
  --text-dim: #8f9ab3;
  --text-faint: #7f8aa3;
  --accent: #ff5716;
  --accent-dim: #8a3010;
  --accent-soft: rgba(255, 87, 22, 0.10);
  --bone: #f7f5f0;

  --series-1: #f85007;
  --series-2: #508efd;
  --series-3: #0faa90;
  --series-4: #9a75f9;
  --series-5: #db4da7;
  --success: #41ba5d;
  --warning: #e4ae1a;
  --danger: #e9504d;

  --mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  --sans: 'Space Grotesk', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --radius: 3px;

  color-scheme: dark;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--sans);
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; }
::selection { background: var(--accent); color: var(--bg); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
h1, h2, h3 { font-family: var(--sans); font-weight: 600; margin: 0; }
p { color: var(--text-dim); margin: 0 0 12px; }
.mono { font-family: var(--mono); }
button, select, input, textarea { font: inherit; }
img, svg { max-width: 100%; }

.btn {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--mono); font-size: 13px; font-weight: 500;
  padding: 9px 14px; border-radius: var(--radius);
  border: 1px solid var(--border); background: var(--panel-2); color: var(--text);
  cursor: pointer; text-decoration: none; line-height: 1;
}
.btn:hover { border-color: var(--text-faint); }
.btn-primary { background: var(--accent); border-color: var(--accent); color: #0a0c10; font-weight: 600; }
.btn-primary:hover { background: #ff6a30; border-color: #ff6a30; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
