/* Generated by brand/sync_theme.py from FuticFlow brand.json and ui.json. */
:root {
  --brand-background: #EEF3F1;
  --brand-surface: #FFFFFF;
  --brand-ink: #10272E;
  --brand-teal: #167D80;
  --brand-amber: #F2B544;
  --brand-violet: #6B57B3;
  --brand-lavender: #EEE9F8;
  --brand-muted: #6C7E80;
  --success: #166443;
  --success-bg: #E7F4EC;
  --success-border: #B8DCC7;
  --warning: #795514;
  --warning-bg: #FFF5DE;
  --warning-border: #E5CD95;
  --error: #A43235;
  --error-bg: #FCECEE;
  --error-border: #E4B8BC;
  --primary: var(--brand-teal);
  --accent: var(--brand-amber);
  --bg: var(--brand-background);
  --surface: var(--brand-surface);
  --ink: var(--brand-ink);
  --muted: color-mix(in srgb, var(--brand-muted) 80%, var(--ink));
  --line: color-mix(in srgb, var(--ink) 13%, var(--surface));
  --subtle-line: color-mix(in srgb, var(--ink) 8%, var(--surface));
  --surface-soft: color-mix(in srgb, var(--bg) 55%, var(--surface));
  --primary-soft: color-mix(in srgb, var(--primary) 8%, var(--surface));
  --primary-border: color-mix(in srgb, var(--primary) 23%, var(--surface));
  --on-primary: var(--surface);
  --on-dark: var(--surface);
  --on-dark-muted: color-mix(in srgb, var(--surface) 88%, transparent);
  --on-dark-soft: color-mix(in srgb, var(--surface) 8%, transparent);
  --on-dark-line: color-mix(in srgb, var(--surface) 22%, transparent);
  --overlay: color-mix(in srgb, var(--ink) 45%, transparent);
  --shadow: 0 5px 22px color-mix(in srgb, var(--ink) 5%, transparent);
  --dialog-shadow: 0 25px 90px color-mix(in srgb, var(--ink) 22%, transparent);
  --toast-shadow: 0 10px 35px color-mix(in srgb, var(--ink) 15%, transparent);
  --font: "IBM Plex Sans Arabic";
  --font-display: "Alexandria";
}