:root {
  color-scheme: light;
  --color-bg: #F3F6F9;
  --color-surface: #FFFFFF;
  --color-text: #1B2733;
  --color-muted: #687786;
  --color-border: #E2E8EE;
  --color-control-border: #687786;
  --color-primary: #229ED9;
  --color-primary-hover: #1683BA;
  --color-primary-dark: var(--color-text);
  --color-accent-soft: #E7F3FB;
  --color-chart-flow: #38A9DF;
  --color-calendar-line: #178AC4;
  --color-calendar-cutoff: #E8F4FB;
  --color-calendar-payment: #DFF1FA;
  --color-alert: #B94A48;
  --color-warning: #AA6A1B;
  --color-warning-soft: var(--color-calendar-payment);
  --color-focus: #1683BA;
  --color-shadow: rgba(27, 39, 51, 0.08);
  --shadow: 0 12px 30px var(--color-shadow);
  --radius: 1rem;
  --container: 70rem;

  /* API reference aliases share the same RutaFin roles. */
  --ink: var(--color-text);
  --muted: var(--color-text);
  --line: var(--color-border);
  --control-border: var(--color-control-border);
  --mint: var(--color-primary);
  --mint-soft: var(--color-accent-soft);
  --surface: var(--color-surface);
  --sidebar: var(--color-bg);
  --primary-hover: var(--color-primary-hover);
  --flow: var(--color-chart-flow);
  --calendar-line: var(--color-calendar-line);
  --calendar-cutoff: var(--color-calendar-cutoff);
  --calendar-payment: var(--color-calendar-payment);
  --alert: var(--color-alert);
  --warning: var(--color-warning);
  --focus: var(--color-focus);
  --code-bg: var(--color-text);
  --code-ink: var(--color-surface);
}
