/* ============================================================
   FlowLens Design Tokens — PROVISIONAL plumbing
   Source: ai-context/design/DESIGN-SYSTEM.md
   Namespace: --fl-*

   Maturity:
   - Values marked PROVISIONAL may change after visual QA (I10).
   - Do NOT treat these as FROZEN brand law.
   - Brand blue (DG-17) remains TBD; accent values are exploration only.
   ============================================================ */

:root {
  /* --- Primitive neutrals (PROVISIONAL) --- */
  --fl-neutral-000: #ffffff;
  --fl-neutral-050: #f5f5f6;
  --fl-neutral-100: #e8e8ea;
  --fl-neutral-200: #d2d2d6;
  --fl-neutral-400: #929298;
  --fl-neutral-500: #74747b;
  --fl-neutral-600: #5c5c63;
  --fl-neutral-700: #3a3a40;
  --fl-neutral-800: #252529;
  --fl-neutral-850: #1c1c20;
  --fl-neutral-900: #141416;
  --fl-neutral-925: #101012;
  --fl-neutral-950: #0b0b0d;

  /* --- Semantic surfaces (PROVISIONAL) --- */
  --fl-bg-canvas: var(--fl-neutral-950);
  --fl-bg-section: var(--fl-neutral-925);
  --fl-surface-base: var(--fl-neutral-900);
  --fl-surface-subtle: var(--fl-neutral-850);
  --fl-surface-elevated: var(--fl-neutral-800);
  --fl-surface-overlay: rgb(11 11 13 / 0.72);

  /* --- Text (PROVISIONAL) --- */
  --fl-text-primary: var(--fl-neutral-050);
  --fl-text-secondary: var(--fl-neutral-200);
  --fl-text-muted: var(--fl-neutral-400);
  --fl-text-inverse: var(--fl-neutral-950);

  /* --- Stroke (PROVISIONAL) --- */
  --fl-stroke-subtle: rgb(255 255 255 / 0.10);
  --fl-stroke-interactive: rgb(255 255 255 / 0.22);
  --fl-stroke-focus: var(--fl-accent-primary);

  /* --- Accent: cold brand blue exploration (PROVISIONAL / DG-17 TBD) ---
     Not FROZEN. Chosen to avoid Demo violet / AI purple-blue gradient language. */
  --fl-accent-primary: #5b8cff;
  --fl-accent-primary-hover: #7aa2ff;
  --fl-accent-primary-active: #3f73f0;
  --fl-accent-primary-soft: rgb(91 140 255 / 0.16);
  --fl-accent-focus: #7aa2ff;
  --fl-accent-primary-rgb: 91 140 255;

  /* --- Status (PROVISIONAL) --- */
  --fl-status-success: #57b889;
  --fl-status-warning: #d6a84b;
  --fl-status-error: #d76868;

  /* --- Type scale (PROVISIONAL; fonts TBD DG-16) --- */
  --fl-type-display: clamp(3rem, 6vw, 5.75rem);
  --fl-type-h1: clamp(2.25rem, 4vw, 4rem);
  --fl-type-h2: clamp(1.75rem, 3vw, 3rem);
  --fl-type-h3: clamp(1.375rem, 2vw, 2rem);
  --fl-type-h4: 1.125rem;
  --fl-type-body-lg: 1.125rem;
  --fl-type-body-md: 1rem;
  --fl-type-body-sm: 0.875rem;
  --fl-type-meta: 0.75rem;

  --fl-leading-display: 0.98;
  --fl-leading-heading: 1.12;
  --fl-leading-body: 1.65;
  --fl-leading-small: 1.5;

  /* --- Spacing (PROVISIONAL) --- */
  --fl-space-1: 0.25rem;
  --fl-space-2: 0.5rem;
  --fl-space-3: 0.75rem;
  --fl-space-4: 1rem;
  --fl-space-5: 1.5rem;
  --fl-space-6: 2rem;
  --fl-space-7: 3rem;
  --fl-space-8: 4rem;
  --fl-space-9: 6rem;
  --fl-space-10: 8rem;

  /* --- Layout (PROVISIONAL) --- */
  --fl-container-max: 1440px;
  --fl-container-reading: 760px;
  --fl-page-gutter-desktop: 48px;
  --fl-page-gutter-tablet: 32px;
  --fl-page-gutter-mobile: 20px;

  /* --- Radius (PROVISIONAL) --- */
  --fl-radius-xs: 4px;
  --fl-radius-sm: 8px;
  --fl-radius-md: 12px;
  --fl-radius-lg: 16px;
  --fl-radius-round: 999px;

  /* --- Elevation / shadow (PROVISIONAL) --- */
  --fl-shadow-e0: none;
  --fl-shadow-e1: 0 8px 24px rgb(0 0 0 / 0.16);
  --fl-shadow-e2: 0 14px 36px rgb(0 0 0 / 0.24);
  --fl-shadow-e3: 0 24px 64px rgb(0 0 0 / 0.34);
  --fl-shadow-e4: 0 36px 96px rgb(0 0 0 / 0.44);

  /* --- Editorial scene surfaces / material depth (PROVISIONAL) --- */
  --fl-surface-paper: #f0efe9;
  --fl-surface-paper-raised: #e7e5de;
  --fl-text-paper-primary: #151517;
  --fl-text-paper-secondary: #454549;
  --fl-text-paper-muted: #66666c;
  --fl-stroke-paper: rgb(21 21 23 / 0.16);
  --fl-accent-on-light: #315fc9;

  --fl-shadow-material-subtle:
    inset 0 1px 0 rgb(255 255 255 / 0.05),
    0 12px 32px rgb(0 0 0 / 0.16);
  --fl-shadow-material-elevated:
    inset 0 1px 0 rgb(255 255 255 / 0.07),
    0 24px 64px rgb(0 0 0 / 0.32);

  /* --- Motion (PROVISIONAL mid-range from Design System) --- */
  --fl-motion-instant: 120ms;
  --fl-motion-fast: 200ms;
  --fl-motion-standard: 300ms;
  --fl-motion-emphasis: 440ms;
  --fl-motion-cinematic: 660ms;

  --fl-ease-standard: cubic-bezier(0.22, 1, 0.36, 1);
  --fl-ease-enter: cubic-bezier(0.16, 1, 0.3, 1);
  --fl-ease-exit: cubic-bezier(0.4, 0, 1, 1);
  --fl-ease-cinematic: cubic-bezier(0.65, 0.05, 0.36, 1);

  /* --- Breakpoints as custom props for documentation / JS (PROVISIONAL DG-15) --- */
  --fl-bp-sm: 480px;
  --fl-bp-md: 768px;
  --fl-bp-lg: 1024px;
  --fl-bp-xl: 1280px;
  --fl-bp-2xl: 1536px;

  /* --- Focus ring (a11y floor support) --- */
  --fl-focus-ring: 0 0 0 2px var(--fl-bg-canvas), 0 0 0 4px var(--fl-accent-focus);
}