/* ════════════════════════════════════════════════════════════════════
   Sightline · Spacing, borders, radii, layout
   The page breathes: wide gutters, generous margins, hairline rules.
   NO shadows. NO gradients. NO glows. Separation = a hairline border or a
   Bone-2 ground — never elevation. Square corners; 2px radius on buttons
   is the only curve besides the wordmark dot.
   ════════════════════════════════════════════════════════════════════ */

:root {
  /* ── Spacing scale (4px base) ────────────────────────────────────── */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  48px;
  --space-8:  64px;
  --space-9:  96px;
  --space-10: 128px;

  /* ── Card / panel internal padding (generous: 24–48px) ───────────── */
  --pad-card:   24px;
  --pad-panel:  32px;
  --pad-page-h: 84px;   /* page horizontal margin */
  --pad-page-v: 72px;   /* page vertical margin */

  /* ── Radii — square is the default ───────────────────────────────── */
  --radius-0:    0px;     /* default — square corners */
  --radius-btn:  2px;     /* buttons, chips */
  --radius-max:  4px;     /* hard ceiling — never exceed */
  --radius-dot:  50%;     /* the wordmark dot ONLY */

  /* ── Borders / hairlines (color tokens live in colors.css) ───────── */
  --border-width:        1px;
  --border-width-strong: 2px;
  --rule-thin:   1px solid var(--hairline);
  --rule-strong: 2px solid var(--hairline-strong);

  /* ── Accent rule (status callouts get a 3px accent edge) ─────────── */
  --rule-accent: 3px;

  /* ── Layout ──────────────────────────────────────────────────────── */
  --measure-body:  64ch;   /* max body line length */
  --measure-head:  20ch;   /* max headline length */
  --measure-lede:  50ch;
  --container:     1200px;
  --gutter:        56px;   /* wide column gutter */

  /* ── Motion — restrained. Fades & eases, never bounce. ───────────── */
  --ease:       cubic-bezier(0.22, 0.61, 0.36, 1);   /* @kind other */ /* ease-out, calm */
  --ease-inout: cubic-bezier(0.45, 0, 0.25, 1);       /* @kind other */
  --dur-fast:   140ms;   /* @kind other */
  --dur:        240ms;   /* @kind other */
  --dur-slow:   480ms;   /* @kind other */

  /* NOTE: --shadow tokens deliberately omitted. The system uses no
     elevation. If you reach for a shadow, use a hairline instead. */
}