/* ---------------------------------------------------------------------------
   PostLane spacing, radii, shadows, motion
   ---------------------------------------------------------------------------
   Soft-depth: cards carry a soft resting shadow (--shadow-card, adopted
   2026-07-12); borders still do the separation work. Radii top out at 12px
   — cards are working surfaces, not consumer cards. Motion is short for
   state changes (100-250ms, eased-out) with a gentle SPRING on entrances
   (420ms, --ease-spring) and one restrained flourish on real wins
   (delivered / approved). Density is power-user tight.
   --------------------------------------------------------------------------- */

:root {
  /* ---- Spacing scale (4px base grid) ---- */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 12px;
  --space-base: 16px;            /* default card / page padding */
  --space-lg: 24px;
  --space-xl: 32px;
  --space-2xl: 48px;
  --space-3xl: 64px;

  /* ---- Radii ---- */
  --radius-sm: 4px;
  --radius-md: 6px;              /* default — buttons, inputs, cards */
  --radius-lg: 8px;
  --radius-xl: 12px;
  --radius-full: 9999px;        /* badges, chips, pills */

  /* ---- Control heights (density-first) ---- */
  --control-sm: 28px;           /* toolbars, table-row buttons */
  --control-md: 32px;           /* default */
  --control-lg: 40px;           /* page-level CTAs */
  --tap-min: 44px;              /* field / mobile tap target minimum */

  /* ---- Layout ---- */
  --sidebar-width: 224px;       /* w-56 */
  --topbar-height: 56px;        /* h-14 */
  --prose-measure: 72ch;        /* cap long-form copy at 65-75ch */

  /* ---- Shadows: warm-tinted. Cards rest on --shadow-card; floating
     elements go deeper. ---- */
  --shadow-card: 0 1px 3px oklch(15% 0.01 85 / 0.07), 0 4px 10px oklch(15% 0.01 85 / 0.04); /* cards at rest */
  --shadow-sm: 0 1px 2px oklch(15% 0.01 85 / 0.05);   /* hover lift on primary CTA */
  --shadow-md: 0 4px 12px oklch(15% 0.01 85 / 0.08);  /* popovers, dropdowns, dialogs */
  --shadow-lg: 0 12px 32px oklch(15% 0.01 85 / 0.12); /* full-page modals only */
  --shadow-edge: 4px 0 8px -2px oklch(15% 0.01 85 / 0.1); /* pinned-column right edge — apply ONLY while horizontally scrolled */

  /* ---- Motion ---- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1); /* @kind other */
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
  /* Spring is for entrances + celebrations only. */
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1); /* @kind other */
  --duration-fast: 100ms; /* @kind other */
  --duration-default: 150ms; /* @kind other */
  --duration-slow: 250ms; /* @kind other */
  --duration-entrance: 420ms; /* @kind other */
}

.dark {
  --shadow-card: 0 1px 3px oklch(8% 0.01 85 / 0.35), 0 4px 10px oklch(8% 0.01 85 / 0.25);
  --shadow-sm: 0 1px 2px oklch(8% 0.01 85 / 0.4);
  --shadow-md: 0 4px 12px oklch(8% 0.01 85 / 0.45);
  --shadow-lg: 0 12px 32px oklch(8% 0.01 85 / 0.55);
  --shadow-edge: 4px 0 8px -2px oklch(4% 0.01 85 / 0.5);
}