/* ==========================================================================
   Notes for Innovation — Research Materials Intelligence
   Design tokens · v1.0.0
   Every colour, space, radius, shadow, size, duration and layer used by the
   theme is defined here. Component CSS must reference these, not raw values.
   ========================================================================== */
:root{
  /* — Colour: Research Blue — */
  --nfi-ink:#081625;
  --nfi-navy:#0B1F3A;
  --nfi-blue:#0B63F6;
  --nfi-blue-2:#2F7DF6;
  --nfi-light-blue:#84B8FF;
  --nfi-pale-blue:#EAF3FF;
  --nfi-ice:#F5F9FF;
  --nfi-white:#FFFFFF;
  --nfi-muted:#64758A;
  --nfi-line:#DCE8F4;
  --nfi-success:#198754;
  --nfi-warning:#B7791F;

  /* — Colour: derived — */
  --nfi-navy-2:#102B4D;
  --nfi-navy-3:#173A66;
  --nfi-text:#17283B;
  --nfi-text-2:#46596F;
  --nfi-line-2:#C7D9EC;
  --nfi-blue-ink:#0A4FC4;
  --nfi-danger:#B3362F;
  --nfi-success-ink:#13683F;
  --nfi-warning-ink:#85560A;
  --nfi-success-bg:#E8F5EE;
  --nfi-warning-bg:#FBF3E2;
  --nfi-danger-bg:#FBECEA;
  --nfi-info-bg:#EAF3FF;
  --on-navy:#DCEBFF;
  --on-navy-2:#9DB8D8;
  --line-on-navy:rgba(132,184,255,.22);

  /* — Typography — */
  --font-display:"Newsreader","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --font-ui:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans Georgian","Noto Sans",sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;

  --fs-micro:.75rem;      /* 12 · mono metadata, never smaller */
  --fs-label:.8125rem;    /* 13 · UI labels */
  --fs-small:.9375rem;    /* 15 */
  --fs-body:1.0625rem;    /* 17 */
  --fs-lead:clamp(1.1rem,1rem + .45vw,1.3125rem);
  --fs-h4:1.0625rem;
  --fs-h3:1.25rem;
  --fs-h2:clamp(1.85rem,1.35rem + 1.9vw,3rem);
  --fs-h1:clamp(2.5rem,1.7rem + 3.6vw,4.75rem);
  --fs-display:clamp(2.9rem,1.5rem + 5.4vw,6rem);

  --lh-tight:1.04;
  --lh-head:1.12;
  --lh-body:1.62;
  --track-display:-.028em;
  --track-head:-.018em;
  --track-label:.06em;

  /* — Spacing (4px base) — */
  --s-1:.25rem;  --s-2:.5rem;   --s-3:.75rem;  --s-4:1rem;
  --s-5:1.5rem;  --s-6:2rem;    --s-7:3rem;    --s-8:4rem;
  --s-9:6rem;    --s-10:8rem;
  --section-y:clamp(3.5rem,2.5rem + 5vw,7rem);
  --gutter:clamp(1.25rem,.6rem + 2.6vw,2.75rem);

  /* — Layout — */
  --w-site:1280px;
  --w-prose:68ch;
  --w-narrow:880px;
  --header-h:72px;
  --topbar-h:34px;

  /* — Shape — */
  --r-1:3px;
  --r-2:6px;
  --r-3:10px;
  --r-4:16px;
  --bw:1px;

  /* — Elevation — */
  --sh-1:0 1px 2px rgba(8,22,37,.04),0 1px 1px rgba(8,22,37,.03);
  --sh-2:0 8px 24px -8px rgba(11,31,58,.12),0 2px 6px rgba(11,31,58,.05);
  --sh-3:0 28px 64px -24px rgba(11,31,58,.28),0 8px 20px -8px rgba(11,31,58,.12);
  --ring:0 0 0 3px rgba(11,99,246,.28);

  /* — Motion — */
  --ease:cubic-bezier(.22,1,.36,1);
  --dur-1:.22s;
  --dur-2:.5s;
  --dur-3:.9s;
  --reveal-shift:16px;

  /* — Layers — */
  --z-base:1;
  --z-raised:5;
  --z-sticky:50;
  --z-header:60;
  --z-menu:70;
  --z-modal:100;
  --z-toast:110;
}
