/* Wadi Evaluation Design System — v1.0 · Direction B
   Use the token name in code, never a raw hex. */

/* Brand fonts — files live in ./fonts */
@font-face{font-family:'Anton';font-style:normal;font-weight:400;src:url('fonts/anton.woff2') format('woff2');font-display:swap}
@font-face{font-family:'Archivo';font-style:normal;font-weight:100 900;src:url('fonts/archivo.woff2') format('woff2');font-display:swap}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:100 800;src:url('fonts/jetbrainsmono.woff2') format('woff2');font-display:swap}

:root {
  /* Brand */
  --purple: #7A5AE0;   /* Primary. Headers, focus, key blocks. on → #FFFFFF */
  --green:  #1F8A5B;   /* Success, completion, score fill. on → #FFFFFF */
  --yellow: #F5C84B;   /* Highlight, pills, CTA on dark.   on → #1A1614 */
  --coral:  #F2724E;   /* Attention, "to go" pills, submit. on → #FFFFFF */

  /* Neutrals */
  --ink:          #1A1614;  /* Text, buttons, outlines. on → #F5C84B / #FFFFFF */
  --surface:      #FFFFFF;  /* Default screen bg */
  --surface-warm: #FBF8F2;  /* Optional warm fill */
  --muted:        #8A8194;  /* Captions, sub-text */
  --hairline:     #EEEEEE;  /* Dividers, tracks */
  --tint-purple:  #EDE7FB;  /* Purple tint surfaces */

  /* Spacing — 4px base */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px;

  /* Radius */
  --r-sm: 12px;   /* inputs-ish small */
  --r-md: 20px;   /* inputs */
  --r-lg: 24px;   /* cards */
  --r-pill: 40px; /* buttons & pills (or 9999) */
  --r-full: 50%;  /* avatars & score circles */

  /* Type families */
  --font-display: 'Anton', sans-serif;        /* headlines, numerals, names */
  --font-text:    'Archivo', sans-serif;      /* body/UI — weights 600/700/800 */
  --font-mono:    'JetBrains Mono', monospace;/* token labels */
}

/* Minimums */
/* tap target ≥ 44px · button min-height 52px · screen padding 18–24 · card padding 16–20 · card gap 14 */