/* ============================================================================
   Coverage — semantic theme layer
   Base color + size primitives live in fig-tokens.css (generated from Figma
   Variables). This file adds the pieces the variable export can't carry:
   type families + scale, pixel-valued radii/spacing, the elevation (shadow)
   system, focus ring, motion, and a handful of surface aliases.
   Colours are referenced by their Figma-variable names, e.g. var(--text-default).
   ========================================================================== */

:root {
  /* ---- Type families ------------------------------------------------------ */
  --font-heading: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-ui:      "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-body:    "Noto Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-mono:    "IBM Plex Mono", "SF Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* ---- Type scale (Nunito headings; tight negative tracking) -------------- */
  /* size / line-height / letter-spacing — transcribed from the Typescale frame */
  --h1-size: 86px;  --h1-line: 88px;  --h1-track: -3px;
  --h2-size: 62px;  --h2-line: 64px;  --h2-track: -2.25px;
  --h3-size: 48px;  --h3-line: 50px;  --h3-track: -1.5px;
  --h4-size: 40px;  --h4-line: 42px;  --h4-track: -1px;
  --h5-size: 36px;  --h5-line: 38px;  --h5-track: -0.85px;
  --h6-size: 30px;  --h6-line: 32px;  --h6-track: -0.7px;
  --h7-size: 24px;  --h7-line: 26px;  --h7-track: -0.55px;
  --h8-size: 20px;  --h8-line: 22px;  --h8-track: -0.45px;
  --h9-size: 18px;  --h9-line: 20px;  --h9-track: -0.4px;
  --h10-size: 16px; --h10-line: 18px; --h10-track: -0.3px;
  --h11-size: 14px; --h11-line: 16px; --h11-track: -0.2px;
  --h12-size: 12px; --h12-line: 14px; --h12-track: -0.1px;

  /* body copy */
  --body-lg: 18px;  --body-lg-line: 28px;
  --body-md: 16px;  --body-md-line: 24px;
  --body-sm: 14px;  --body-sm-line: 20px;
  --body-xs: 12px;  --body-xs-line: 16px;

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-extrabold: 800;

  /* ---- Radii (pixel aliases of the Figma radius scale) -------------------- */
  --radius-none: 0;
  --radius-xs: 2px;   /* mini buttons round to 3px in-app */
  --radius-sm: 3px;   /* inputs, search fields */
  --radius-md: 4px;   /* buttons, tags, standard controls */
  --radius-lg: 6px;
  --radius-xl: 8px;   /* cards, modules */
  --radius-2xl: 12px;
  --radius-3xl: 16px;
  --radius-pill: 9999px;

  /* ---- Spacing (4px base grid) -------------------------------------------- */
  --space-0-5: 2px;
  --space-1: 4px;
  --space-1-5: 6px;
  --space-2: 8px;
  --space-2-5: 10px;
  --space-3: 12px;
  --space-3-5: 14px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;

  /* ---- Elevation ----------------------------------------------------------
     Two families:
       · soft "resting" shadows for cards & modules (cool navy, low alpha)
       · Z-depth overlay shadows for popovers, drawers, modals (23,43,77 @ .32) */
  --shadow-button: 0 1px 2px 0 rgba(39,41,66,0.15), 0 2px 4px 0 rgba(26,43,68,0.07);
  --shadow-xs: 0 1px 2px 0 rgba(26,43,68,0.06);
  --shadow-sm: 0 1px 2px 0 rgba(26,43,68,0.07), 0 1px 3px 0 rgba(26,43,68,0.06);
  --shadow-card: 0 1px 2px 0 rgba(26,43,68,0.06), 0 2px 6px 0 rgba(26,43,68,0.10);
  --shadow-md: 0 2px 4px 0 rgba(26,43,68,0.07), 0 4px 12px 0 rgba(26,43,68,0.10);
  --shadow-z100: 0 2px 4px 0 rgba(23,43,77,0.20);
  --shadow-z200: 0 4px 6px 0 rgba(23,43,77,0.28);
  --shadow-z300: 0 8px 16px 0 rgba(23,43,77,0.30);
  --shadow-z500: 0 24px 32px 0 rgba(23,43,77,0.32);
  --shadow-drawer: 0 0 24px 0 rgba(23,43,77,0.32);
  /* pressed-in field treatment */
  --shadow-inset-field: inset 1px 2px 3px 0 rgba(0,0,0,0.10);

  /* ---- Focus & motion ----------------------------------------------------- */
  --focus-ring: 0 0 0 3px rgba(69,71,186,0.35);
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --dur-fast: 120ms; /* @kind other */
  --dur-base: 180ms; /* @kind other */
  --dur-slow: 260ms; /* @kind other */

  /* ---- Surface aliases (built on the Figma background variables) ---------- */
  --surface-page: var(--background-neutral-1);   /* app canvas */
  --surface-card: var(--background-white);
  --surface-sunken: var(--background-neutral-2);
  --surface-purple-soft: var(--background-purple-1);
}
