/* Path Architects — Spacing, Radii, Borders, Elevation, Motion
   ------------------------------------------------------------------
   Architectural restraint: a strict 4px grid, minimal corner radius
   (paper & drafting edges are crisp), hairline borders, and soft,
   low-spread shadows that read like paper lifting off paper. */

:root {
  /* ---- Spacing (4px base grid) ---- */
  --space-0:  0;
  --space-1:  0.25rem;  /* 4 */
  --space-2:  0.5rem;   /* 8 */
  --space-3:  0.75rem;  /* 12 */
  --space-4:  1rem;     /* 16 */
  --space-5:  1.5rem;   /* 24 */
  --space-6:  2rem;     /* 32 */
  --space-7:  2.5rem;   /* 40 */
  --space-8:  3rem;     /* 48 */
  --space-9:  4rem;     /* 64 */
  --space-10: 5rem;     /* 80 */
  --space-12: 7.5rem;   /* 120 */
  --space-14: 10rem;    /* 160 */

  /* ---- Container widths ---- */
  --container-narrow: 44rem;   /* 704 — reading measure */
  --container-base:   68rem;   /* 1088 */
  --container-wide:   80rem;   /* 1280 */
  --gutter:           var(--space-6);

  /* ---- Radii (intentionally small — crisp paper edges) ---- */
  --radius-none: 0;
  --radius-xs:   2px;
  --radius-sm:   4px;
  --radius-md:   6px;   /* default control / card */
  --radius-lg:   10px;
  --radius-pill: 999px;

  /* ---- Borders ---- */
  --border-width-hair: 1px;
  --border-width-base: 1.5px;
  --border-width-bold: 2px;

  /* ---- Elevation (soft, cool-tinted, low spread) ---- */
  --shadow-none:  none;
  --shadow-xs:    0 1px 2px rgba(11, 34, 56, 0.06);
  --shadow-sm:    0 1px 3px rgba(11, 34, 56, 0.08), 0 1px 2px rgba(11, 34, 56, 0.04);
  --shadow-md:    0 4px 14px rgba(11, 34, 56, 0.08), 0 2px 4px rgba(11, 34, 56, 0.05);
  --shadow-lg:    0 12px 32px rgba(11, 34, 56, 0.10), 0 4px 8px rgba(11, 34, 56, 0.05);
  --shadow-xl:    0 24px 60px rgba(11, 34, 56, 0.14), 0 8px 16px rgba(11, 34, 56, 0.06);
  --shadow-focus: 0 0 0 3px rgba(46, 94, 134, 0.28);
  --shadow-gold-focus: 0 0 0 3px rgba(196, 162, 104, 0.34);

  /* ---- Motion (restrained, no bounce — deliberate & precise) ---- */
  --ease-standard: cubic-bezier(0.22, 0.61, 0.36, 1); /* @kind other */
  --ease-out:      cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --ease-in:       cubic-bezier(0.4, 0, 1, 1); /* @kind other */
  --dur-fast:   120ms; /* @kind other */
  --dur-base:   200ms; /* @kind other */
  --dur-slow:   360ms; /* @kind other */

  /* ---- Z-index ---- */
  --z-base: 1; /* @kind other */
  --z-sticky: 100; /* @kind other */
  --z-overlay: 1000; /* @kind other */
  --z-modal: 1100; /* @kind other */
  --z-toast: 1200; /* @kind other */
}
