/* BournWise spacing, radii, borders, elevation.
   The structural rule: color blocks butt together edge-to-edge —
   no gaps, no rounding, no shadows. Softness is reserved for the
   conversational layer (composer, chips) which is fully pill-shaped. */

: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: 40px;
  --space-8: 64px;

  /* control heights — the ladder, on the same 4px grid as the spacing above.
     44 is the DEFAULT rather than the maximum, because 44 is the touch minimum
     (Apple HIG; WCAG 2.5.5). A control painted smaller than this does not get
     to be small quietly — it has to earn it with a hit area, which is what the
     touch-target block in refinement.css gives it. */
  --ctl-chip: 28px;       /* inline metadata, tags */
  --ctl-compact: 36px;    /* secondary control in dense chrome */
  --ctl: 44px;            /* the default */
  --ctl-prominent: 52px;  /* primary action */

  /* radii — only two legal values */
  --radius-blade: 0;      /* every structural slab, card, bubble, plan */
  --radius-pill: 999px;   /* composer, chips, the friendly layer */

  /* borders */
  --border-hair: 1px solid var(--hairline);
  --border-current: 1px solid currentColor; /* @kind other */ /* mono bracket CTAs */

  /* elevation — slabs never cast shadows; only floating conversational
     elements (composer, dialogs) may use --shadow-float */
  --shadow-none: none;
  --shadow-float: 0 10px 32px rgba(0, 0, 0, .30);

  /* accent stripe (the decisive 4th-color slab cutting a seam) */
  --slab-thickness: 14px;

  /* Motion primitives live in motion.css. Keeping spacing free of timing
     values means a page can never silently override the shared cadence. */
}
