// Border radius system
:root {
  --radius-none: 0;
  --radius-sm: 0.125rem;   // 2px
  --radius-md: 0.375rem;   // 6px
  --radius-lg: 0.5rem;     // 8px
  --radius-xl: 0.75rem;    // 12px
  --radius-2xl: 1rem;      // 16px
  --radius-full: 9999px;
}

/**
 * @section Border Radius
 */

/** @public No border radius */
.rounded-none { border-radius: var(--radius-none); }

/** @public Small border radius - 2px */
.rounded-sm { border-radius: var(--radius-sm); }

/** @public Medium border radius - 6px */
.rounded-md { border-radius: var(--radius-md); }

/** @public Large border radius - 8px */
.rounded-lg { border-radius: var(--radius-lg); }

/** @public Extra large border radius - 12px */
.rounded-xl { border-radius: var(--radius-xl); }

/** @public 2XL border radius - 16px */
.rounded-2xl { border-radius: var(--radius-2xl); }

/** @public Full circle/pill shape */
.rounded-full { border-radius: var(--radius-full); }