/* ============================================================
   Pegel — Spacing, radii, shadows, blur, motion
   8pt-based spacing with a couple of half-steps for dense rows.
   Radii are generous and soft (watery, friendly, never sharp).
   The "estimate blur" tokens encode the brand's core idea:
   readings are guesses, so edges are soft, never crisp.
   ============================================================ */
:root {
  /* spacing — 8pt base */
  --space-0: 0;
  --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;

  /* layout */
  --screen-pad: 20px;        /* portrait side gutters */
  --safe-top: 12px;
  --safe-bottom: 28px;       /* above gesture bar */
  --max-mobile: 440px;       /* design width cap */

  /* radii — soft */
  --radius-xs: 8px;
  --radius-sm: 12px;
  --radius-md: 16px;
  --radius-lg: 22px;
  --radius-xl: 28px;
  --radius-2xl: 36px;
  --radius-pill: 999px;
  --radius-card: var(--radius-lg);
  --radius-sheet: var(--radius-2xl);

  /* shadows — low, soft, cool-tinted (water never casts hard shadows) */
  --shadow-xs: 0 1px 2px oklch(0.25 0.03 250 / 0.05);
  --shadow-sm: 0 2px 8px oklch(0.25 0.03 250 / 0.06);
  --shadow-card: 0 6px 20px oklch(0.40 0.04 245 / 0.08);
  --shadow-lift: 0 12px 32px oklch(0.40 0.05 245 / 0.12);
  --shadow-sheet: 0 -10px 40px oklch(0.30 0.04 250 / 0.14);
  --shadow-inset: inset 0 1px 0 oklch(1 0 0 / 0.6);

  /* focus ring */
  --ring: 0 0 0 3px var(--water-200);

  /* estimate blur — the soft-edge motif for "this is a guess" */
  --blur-estimate-soft: 0.4px; /* @kind other */
  --blur-estimate: 1.5px; /* @kind other */
  --blur-estimate-strong: 6px; /* @kind other */

  /* motion — calm, water-like; no bounces, gentle ease */
  --ease-water: cubic-bezier(0.33, 0, 0.2, 1); /* @kind other */
  --ease-out-soft: cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --dur-fast: 140ms; /* @kind other */
  --dur-base: 240ms; /* @kind other */
  --dur-slow: 420ms; /* @kind other */
  --dur-fill: 900ms; /* @kind other */
}