/* Brand variables (auto-generated from Settings -> Style or Theme) */
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&family=Inter:wght@400;500;600;700&display=swap');
:root {
  --brand-primary: #00C0A5;
  --brand-accent: #0190D5;
  --brand-deep: #055EB8;
  --brand-text: #0f172a;
  --brand-bg-app: #f8fafc;
  --brand-success: #10B981;
  --brand-warning: #F5B041;
  --brand-danger: #EF4444;
  --brand-info: #0190D5;
  --brand-cta: #000000;
  --brand-accent-gradient: linear-gradient(135deg, #00C0A5 0%, #0190D5 100%);
  --brand-gradient: linear-gradient(135deg, #00C0A5 0%, #0190D5 50%, #055EB8 100%);
  --brand-font-heading: 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --brand-font-body: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  /* Override the legacy variable names so existing components reskin too */
  --accent: #00C0A5;
  --accent-2: #0190D5;
  --green: #10B981;
  --gold: #F5B041;
  --orange: #F5B041;
  --red: #EF4444;
}
body { font-family: var(--brand-font-body); }
h1, h2, h3, h4 { font-family: var(--brand-font-heading); }
/* Gentle per-theme canvas wash so the whole balance shifts with the palette.
   Light mode only - dark mode keeps its own background. */
html:not([data-theme="dark"]) body { background-color: color-mix(in srgb, #00C0A5 4%, #F6F8FC); }