/* Talhão · effects — radii, borders, shadows, motion.
   Corners are tight (2–6px), borders are hairline, shadows are rare and
   reserved for dark overlays/menus. Motion is subtle: short fades + eases. */
:root{
  /* radii */
  --r-xs: 2px;    /* pills, swatches, tiny tags */
  --r-sm: 3px;    /* buttons, chips, tabs */
  --r-md: 4px;    /* cards, doc buttons */
  --r-lg: 5px;    /* ficha panel, share menu */
  --r-xl: 6px;    /* map card */

  /* borders */
  --bw: 1px;
  --border-hair: 1px solid var(--line);
  --border-control: 1px solid var(--line-2);

  /* shadows (used sparingly, mostly on dark surfaces) */
  --shadow-menu: 0 18px 48px -14px rgba(5,16,9,0.65);
  --shadow-dark: 0 18px 48px -14px rgba(5,16,9,0.45);

  /* dark scrim gradients (hero, gallery captions) */
  --scrim-hero: linear-gradient(to top, rgba(5,16,9,0.92) 0%, rgba(5,16,9,0.5) 45%, rgba(5,16,9,0.18) 100%); /* @kind color */
  --scrim-caption: linear-gradient(to top, rgba(5,16,9,0.82), rgba(5,16,9,0)); /* @kind color */

  /* motion */
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1); /* @kind other */
  --dur-fast: 0.15s; /* @kind other */
  --dur: 0.35s; /* @kind other */
  --dur-slow: 0.55s; /* @kind other */
}