/* ==========================================================================
   Vision — Border radius + elevation
   ========================================================================== */
:root {
  --vds-radius-none:   0px;
  --vds-radius-sm:     4px;  /* subtle rounding */
  --vds-radius-md:     6px;  /* default card rounding, buttons, inputs */
  --vds-radius-default:8px;  /* standard rounding */
  --vds-radius-lg:     12px; /* pronounced rounding */
  --vds-radius-xl:     16px; /* large rounding */
  --vds-radius-full:   999px;/* pill / circle */

  /* Elevation — soft, low-contrast shadows for a calm enterprise surface. */
  --vds-shadow-none: none;
  --vds-shadow-sm:   0 1px 2px rgba(17,24,39,0.06);
  --vds-shadow-md:   0 1px 3px rgba(17,24,39,0.08), 0 1px 2px rgba(17,24,39,0.04);
  --vds-shadow-lg:   0 4px 12px rgba(17,24,39,0.10);
  --vds-shadow-pop:  0 8px 24px rgba(17,24,39,0.14);

  /* Hairline border, expressed as inset shadow (matches Figma stroke usage) */
  --vds-hairline:        inset 0 0 0 1px var(--vds-border);
  --vds-hairline-strong: inset 0 0 0 1px var(--vds-border-strong);
}