/* DemoFit — brand tokens. Colours measured on the logo (brand/logo.png): navy wordmark "Demo",
   blue "Fit" and the D symbol's gradient from blue to cyan. Loaded before app.css. */

:root {
  --df-navy: #1A2836;
  --df-blue: #005EF9;
  --df-cyan: #00D2D6;
  --df-gradient: linear-gradient(135deg, #005EF9, #00D2D6);
  --df-bg: #F5F7FA;
  --df-border: #E3E8EF;
  --df-muted: #5B6675;

  --df-paper: #FFFFFF;
  --df-blue-dark: #004BCC;      /* hover / pressed */
  --df-blue-soft: #E8F0FE;      /* selected rows, notes */
  --df-cyan-soft: #E0F8F8;
  --df-ok: #0E9F8E;             /* teal between blue and cyan, readable on white */
  --df-warn: #C98A1B;
  --df-bad: #C0392B;
  --df-bad-soft: #FBECEB;
  --df-bad-text: #7A1F17;

  --df-sans: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --df-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --df-radius: 10px;
  --df-radius-control: 8px;
  --df-focus: 0 0 0 3px rgba(0, 94, 249, 0.25);
}