/* ───────────────────────────────────────────────────────────
   Sonora · Spacing, radius, border, shadow, layout
   4px base unit. Sharp corners. Hairlines over shadows —
   this is ink-on-plaster, not floating glass.
   ─────────────────────────────────────────────────────────── */

:root {
  /* ── Spacing scale (4px base) ─────────────────────────────── */
  --space-0:   0;
  --space-px:  1px;
  --space-1:   4px;
  --space-2:   8px;
  --space-3:   12px;
  --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;
  --space-32:  128px;

  /* ── Radius — Bauhaus restraint, near-square ──────────────── */
  --radius-none: 0;
  --radius-sm:   2px;
  --radius-md:   3px;
  --radius-lg:   5px;
  --radius-pill: 999px;

  /* ── Borders — hairline is the structural primitive ───────── */
  --border-width: 1px;
  --border-width-thick: 1.5px;
  --border-hairline: 1px solid var(--border-hair);
  --border-rule:     1px solid var(--border-strong);

  /* ── Shadow — matte; used sparingly for lifted overlays ───── */
  --shadow-none: none;
  --shadow-sm:  0 1px 2px rgba(33, 31, 26, 0.06);
  --shadow-md:  0 4px 14px rgba(33, 31, 26, 0.10);
  --shadow-pop: 0 12px 34px rgba(33, 31, 26, 0.16);

  /* ── Layout ───────────────────────────────────────────────── */
  --container-max: 1240px;
  --gutter:        var(--space-6);
  --col-gap:       var(--space-6);
  --grid-unit:     8px; /* the underlying Swiss grid module */

  /* ── Motion — restrained, mechanical, no bounce ───────────── */
  --ease-standard: cubic-bezier(0.2, 0, 0.1, 1); /* @kind other */
  --ease-out:      cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --dur-fast:   120ms; /* @kind other */
  --dur-base:   200ms; /* @kind other */
  --dur-slow:   360ms; /* @kind other */

  /* ── Focus ────────────────────────────────────────────────── */
  --focus-ring-width: 2px;
  --focus-ring-offset: 2px;
}

::selection { background: var(--selection-bg); color: var(--ink-900); }