/* ProductionFlow UI Foundation v1.0.0 — semantic tokens; projects override values, not selectors. */
:root {
  color-scheme: light;
  --flow-canvas: #f4f2ed;
  --flow-surface: #ffffff;
  --flow-surface-soft: #faf9f6;
  --flow-surface-sunken: #f5f5f1;
  --flow-ink: #222720;
  --flow-ink-secondary: #596057;
  --flow-muted: #7c8279;
  --flow-line: #e5e5de;
  --flow-line-strong: #d7d9d1;
  --flow-brand: #425846;
  --flow-brand-dark: #344638;
  --flow-brand-soft: #e9eee7;
  --flow-success: #39765c;
  --flow-warning: #a9782d;
  --flow-warning-soft: #f6f0e3;
  --flow-danger: #a94e42;
  --flow-danger-soft: #f7eae7;
  --flow-info: #50778a;
  --flow-info-soft: #eaf1f4;
  --flow-radius-sm: 6px;
  --flow-radius-md: 10px;
  --flow-radius-lg: 14px;
  --flow-shadow-popover: 0 12px 36px rgba(18, 38, 46, .18);
  --flow-shadow-card: 0 1px 2px rgba(25, 40, 32, .025);
  --flow-font: "DM Sans", "Segoe UI", Arial, sans-serif;
  --flow-font-display: "Manrope", "DM Sans", "Segoe UI", Arial, sans-serif;
  --flow-text-scale: 1;
  --flow-space-1: 4px;
  --flow-space-2: 8px;
  --flow-space-3: 12px;
  --flow-space-4: 16px;
  --flow-space-5: 24px;
  --flow-header-height: 66px;
  --flow-mobile-header-height: calc(104px + env(safe-area-inset-top, 0px));
  --flow-sidebar-width: 252px;
  --flow-sticky-z: 20;
  --flow-drawer-z: 80;
  --flow-motion-fast: 120ms;
  --flow-motion-standard: 180ms;
  --flow-motion-enter: 240ms;
  --flow-ease-standard: cubic-bezier(.2, .7, .2, 1);
}

:root[data-flow-theme="dark"] {
  color-scheme: dark;
  --flow-canvas: #171b18;
  --flow-surface: #202622;
  --flow-surface-soft: #272e29;
  --flow-surface-sunken: #1b211d;
  --flow-ink: #edf1eb;
  --flow-ink-secondary: #c2ccc0;
  --flow-muted: #9ba69a;
  --flow-line: #38413a;
  --flow-line-strong: #4a554b;
  --flow-brand: #9bb9a1;
  --flow-brand-dark: #c2d6c4;
  --flow-brand-soft: #2d3b31;
  --flow-success: #83c3a0;
  --flow-warning: #e3b86e;
  --flow-warning-soft: #3c3323;
  --flow-danger: #e29a8c;
  --flow-danger-soft: #3d2c29;
  --flow-info: #9abfd0;
  --flow-info-soft: #26363e;
  --flow-shadow-popover: 0 16px 44px rgba(0, 0, 0, .45);
  --flow-shadow-card: 0 1px 2px rgba(0, 0, 0, .2);
}