:root {
  --color-brand: #176b87;
  --color-brand-strong: #0f4f63;
  --color-brand-contrast: #ffffff;
  --color-surface-page: #f6f7f9;
  --color-surface: #ffffff;
  --color-surface-muted: #f9fafb;
  --color-surface-disabled: #eef1f5;
  --color-text: #1f2933;
  --color-text-muted: #6b7280;
  --color-border: #d9dee7;
  --color-focus: var(--color-brand);
  --color-success-surface: #e8f5ee;
  --color-success-border: #bddfc9;
  --color-danger: #a43f3f;
  --color-danger-surface: #fff0f0;
  --color-danger-border: #e5b4b4;
  --shadow-raised: 0 1rem 2.5rem rgba(31, 41, 51, 0.08);

  --invoice-color-accent: var(--color-brand);
  --invoice-color-accent-strong: var(--color-brand-strong);
  --invoice-color-surface: var(--color-surface);
  --invoice-color-surface-muted: var(--color-surface-muted);
  --invoice-color-text: var(--color-text);
  --invoice-color-text-muted: var(--color-text-muted);
  --invoice-color-border: var(--color-border);

  --bg: var(--color-surface-page);
  --panel: var(--color-surface);
  --text: var(--color-text);
  --muted: var(--color-text-muted);
  --line: var(--color-border);
  --primary: var(--color-brand);
  --primary-dark: var(--color-brand-strong);
  --danger: var(--color-danger);
}