/* GEC design tokens — direction « Bento ludique » (ADR-002). Source: mockups/bento/tokens.css.
   Components only use these variables, never raw colors. */
:root {
  --gec-font-heading: "Bricolage Grotesque", system-ui, sans-serif;
  --gec-font-body: "Figtree", system-ui, sans-serif;

  --gec-bg: #F5F2EB;
  --gec-surface: #FFFFFF;
  --gec-surface-2: #EFEBE2;
  --gec-text: #132A2E;
  --gec-text-muted: #4A5B5E;
  --gec-border: #DDD6C8;
  --gec-focus: #1D4ED8;

  --gec-primary: #0F6B63;
  --gec-on-primary: #FFFFFF;
  --gec-primary-soft: #CDEFEA;
  --gec-primary-fg: #0B4F49;
  --gec-accent: #F2B43C;
  --gec-on-accent: #2A1C00;
  --gec-accent-soft: #FCE9BD;
  --gec-accent-fg: #6B4300;
  --gec-positive: #B86E00;
  --gec-positive-soft: #FFE7B8;
  --gec-positive-fg: #6B4300;

  --gec-tile-1: #CDEFEA;
  --gec-tile-2: #FCE9BD;
  --gec-tile-3: #FFDCD2;
  --gec-tile-4: #D6E7FB;

  --gec-avatar-1: #CDEFEA; --gec-avatar-2: #FCE9BD; --gec-avatar-3: #FFDCD2;
  --gec-avatar-4: #D6E7FB; --gec-avatar-5: #E6DEFA; --gec-avatar-6: #DCEFD0;

  --gec-phase-warning-bg: #FFF1BF;    --gec-phase-warning-fg: #6B4A00;    --gec-phase-warning-solid: #A87400;
  --gec-phase-escalation-bg: #FFE0C2; --gec-phase-escalation-fg: #7A3300; --gec-phase-escalation-solid: #C25A0A;
  --gec-phase-peak-bg: #FFD9D6;       --gec-phase-peak-fg: #8A1C2B;       --gec-phase-peak-solid: #C8323F;
  --gec-phase-recovery-bg: #CDEFEA;   --gec-phase-recovery-fg: #0B4F49;   --gec-phase-recovery-solid: #13877C;

  --gec-track: #E7E1D5;
  --gec-track-border: #8A7E68;
  --gec-validate-bg: #F3E8FF;
  --gec-validate-fg: #6B21A8;

  --gec-jar-glass: #EAF6F4; --gec-jar-stroke: #4F8F88; --gec-jar-lid: #0F6B63;
  --gec-bean: #B86E00; --gec-bean-stroke: #6B4300; --gec-bean-empty: #8A7E68;
  --gec-trend: #CFC6B4; --gec-trend-last: #0F6B63;

  --gec-radius-sm: 12px; --gec-radius-md: 20px; --gec-radius-lg: 28px; --gec-radius-xl: 36px; --gec-radius-pill: 999px;
  --gec-avatar-radius: 16px;
  --gec-phone-radius: 36px;
  --gec-shadow-card: 0 1px 0 rgb(19 42 46 / .06), 0 8px 20px -10px rgb(19 42 46 / .22);
  --gec-shadow-pop: 0 2px 0 rgb(19 42 46 / .08), 0 18px 40px -16px rgb(19 42 46 / .30);
  --gec-icon-stroke: 2.25;
  --gec-scrim: rgb(19 42 46 / .45);

}
