/* EczaBoard product design tokens.
   Load before surface and component styles; no selectors belong in this file. */
:root {
  --brand-950: #092a27;
  --brand-900: #0e3934;
  --brand-800: #134e4a;
  --brand-700: #007566;
  --brand-500: #54b89f;
  --brand-300: #8ce4cc;
  --brand-100: #dff3ec;
  --brand-50: #f2faf7;
  --accent-800: #78350f;
  --accent-700: #92400e;
  --accent-600: #b45309;
  --white: #ffffff;
  --surface: #ffffff;
  --surface-subtle: #f7fbf9;
  --surface-raised: #ffffff;
  --canvas: #f2f7f5;
  --canvas-soft: #f6faf8;
  --canvas-public: #f3f8f6;
  --line: #d9e8e2;
  --line-strong: #bfd8cf;
  --ink: #102824;
  --ink-muted: #62746f;
  --state-success: #16805f;
  --state-success-bright: #059669;
  --state-success-strong: #166534;
  --state-warning: #b45309;
  --state-danger: #b4232d;
  --state-danger-bright: #dc2626;
  --state-danger-strong: #991b1b;
  --state-info: #2563a6;
  /* Semantic status dictionary (VIS-02): ok / warn / critical / neutral */
  --status-ok-fg: var(--state-success-strong);
  --status-ok-bg: #dcfce7;
  --status-warn-fg: var(--state-warning);
  --status-warn-bg: #fef3c7;
  --status-critical-fg: var(--state-danger-strong);
  --status-critical-bg: #fecaca;
  --status-neutral-fg: var(--ink-muted);
  --status-neutral-bg: #f1f5f9;
  --focus-outline: #0d9488;
  --radius-xs: 8px;
  --radius-sm: 12px;
  --radius-md: 16px;
  --radius-lg: 20px;
  --radius-xl: 24px;
  --radius-pill: 999px;
  --shadow-xs: 0 1px 2px rgba(15, 40, 35, 0.045);
  --shadow-sm: 0 1px 2px rgba(15, 40, 35, 0.04), 0 10px 26px rgba(15, 40, 35, 0.055);
  --shadow-md: 0 1px 2px rgba(15, 40, 35, 0.04), 0 16px 40px rgba(15, 40, 35, 0.075);
  --shadow-lg: 0 26px 70px rgba(15, 40, 35, 0.12);
  --focus-ring: 0 0 0 3px rgba(15, 118, 110, 0.16);
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-14: 56px;
  --space-16: 64px;
  --space-18: 72px;
  /* Semantic rhythm: inner controls < cards < shells < sections. */
  --space-cluster: var(--space-3);
  --space-stack: var(--space-4);
  --space-layout: var(--space-6);
  --space-card: var(--space-6);
  --space-page-x: var(--space-6);
  --space-section-y: var(--space-16);
  --radius-control: var(--radius-sm);
  --radius-card: var(--radius-md);
  --radius-shell: var(--radius-lg);
  --radius-dialog: var(--radius-xl);
}
