/* Shadow and motion. FamilyFi is a nearly shadowless UI: a hairline does the work
   of a shadow almost everywhere, and only three things lift off the page. */
:root{
  --ff-shadow-sheet:0 24px 60px rgba(0,0,0,.28);
  --ff-shadow-toast:0 8px 24px rgba(0,0,0,.12);
  --ff-shadow-knob:0 1px 2px rgba(0,0,0,.12);
  --ff-shadow-none:none;

  --ff-focus:0 0 0 3px var(--ff-focus-ring);
  --ff-border-card:1px solid var(--ff-hairline-card);
  --ff-border-row:1px solid var(--ff-hairline);
  --ff-border-control:1px solid var(--ff-control-line);

  /* Motion: state changes are instant or near-instant. The gateway is the slow
     part, never the interface — nothing bounces, nothing slides in decoratively. */
  --ff-duration-instant:0ms; /* @kind other */
  --ff-duration-fast:120ms; /* @kind other */
  --ff-duration-sheet:180ms; /* @kind other */
  --ff-ease-standard:cubic-bezier(.32,.72,0,1); /* @kind other */
  --ff-ease-out:cubic-bezier(.16,1,.3,1); /* @kind other */

  /* Pressed/disabled conventions */
  --ff-press-opacity:.72; /* @kind other */
  --ff-disabled-opacity:.4; /* @kind other */
  --ff-disabled-opacity-button:.6; /* @kind other */

  /* The header wash is the only blur in the product. */
  --ff-blur-header:blur(12px); /* @kind other */
}