:root {
  /* Envalo brand palette — neutrals tinted charcoal/slate */
  --ink: #24282f;          /* charcoal — primary text */
  --ink-soft: #5d6675;     /* slate — secondary text */
  --ink-faint: #95a0af;    /* light slate — captions */
  --line: #d9d9d9;         /* light gray — borders */
  --line-soft: #e7eaee;
  --paper: #f4f6f8;        /* off-white — page bg */
  --panel: #ffffff;        /* white — card fills */
  --fill: #e9edf1;
  --fill-2: #f1f3f6;
  --active: #1f4e79;       /* navy — structural active (nav, toggles) */
  --active-ink: #ffffff;
  --accent: #f28623;       /* orange — brand accent / nav underline */
  /* brand semantic tokens */
  --cta: #f28623;          /* orange — primary action buttons */
  --cta-ink: #ffffff;
  --cta-hover: #c0392b;    /* crimson — hover */
  --navy: #1f4e79;
  --charcoal: #24282f;
  --topbar-bg: linear-gradient(96deg, #24282f 0%, #1f3a55 100%);
  --info: #4ab3e2;         /* sky blue — info */
  --warn: #c0392b;         /* crimson — warnings */
  --amber: #ffb039;
  --radius: 4px;
  --topbar-h: 56px;
  --row-h: 40px;
  --pad: 16px;
  --ui-font: 'Inter', system-ui, sans-serif;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
body {
  font-family: var(--ui-font);
  background: var(--paper);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
}
#root { height: 100vh; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: var(--line); border-radius: 10px; border: 2px solid var(--paper); }