:root {
    --r-none: 0;
    --r-sm:   0.125rem; /* 2px */
    --r:      0.25rem;  /* 4px */
    --r-md:   0.375rem; /* 6px */
    --r-lg:   0.5rem;   /* 8px */
    --r-xl:   0.75rem;  /* 12px */
    --r-2xl:  1rem;     /* 16px */
    --r-3xl:  1.5rem;   /* 24px */
    --r-5xl:  3.6rem;
    --r-full: 9999px;
}


.rounded-none { border-radius: var(--r-none); }
.rounded-sm   { border-radius: var(--r-sm); }
.rounded      { border-radius: var(--r); }
.rounded-md   { border-radius: var(--r-md); }
.rounded-lg   { border-radius: var(--r-lg); }
.rounded-xl   { border-radius: var(--r-xl); }
.rounded-2xl  { border-radius: var(--r-2xl); }
.rounded-3xl  { border-radius: var(--r-3xl); }
.rounded-full { border-radius: var(--r-full); }



.rounded-t-sm  { border-top-left-radius: var(--r-sm);  border-top-right-radius: var(--r-sm); }
.rounded-t     { border-top-left-radius: var(--r);     border-top-right-radius: var(--r); }
.rounded-t-md  { border-top-left-radius: var(--r-md);  border-top-right-radius: var(--r-md); }
.rounded-t-lg  { border-top-left-radius: var(--r-lg);  border-top-right-radius: var(--r-lg); }
.rounded-t-xl  { border-top-left-radius: var(--r-xl);  border-top-right-radius: var(--r-xl); }
.rounded-t-2xl { border-top-left-radius: var(--r-2xl); border-top-right-radius: var(--r-2xl); }
.rounded-t-3xl { border-top-left-radius: var(--r-3xl); border-top-right-radius: var(--r-3xl); }



.rounded-r-sm  { border-top-right-radius: var(--r-sm);  border-bottom-right-radius: var(--r-sm); }
.rounded-r     { border-top-right-radius: var(--r);     border-bottom-right-radius: var(--r); }
.rounded-r-md  { border-top-right-radius: var(--r-md);  border-bottom-right-radius: var(--r-md); }
.rounded-r-lg  { border-top-right-radius: var(--r-lg);  border-bottom-right-radius: var(--r-lg); }
.rounded-r-xl  { border-top-right-radius: var(--r-xl);  border-bottom-right-radius: var(--r-xl); }
.rounded-r-2xl { border-top-right-radius: var(--r-2xl); border-bottom-right-radius: var(--r-2xl); }
.rounded-r-3xl { border-top-right-radius: var(--r-3xl); border-bottom-right-radius: var(--r-3xl); }
.rounded-r-5xl { border-top-right-radius: var(--r-5xl); border-bottom-right-radius: var(--r-5xl); }
.rounded-r-full { border-top-right-radius: var(--r-full); border-bottom-right-radius: var(--r-full); }


.rounded-l-sm  { border-top-left-radius: var(--r-sm);  border-bottom-left-radius: var(--r-sm); }
.rounded-l     { border-top-left-radius: var(--r);     border-bottom-left-radius: var(--r); }
.rounded-l-md  { border-top-left-radius: var(--r-md);  border-bottom-left-radius: var(--r-md); }
.rounded-l-lg  { border-top-left-radius: var(--r-lg);  border-bottom-left-radius: var(--r-lg); }
.rounded-l-xl  { border-top-left-radius: var(--r-xl);  border-bottom-left-radius: var(--r-xl); }
.rounded-l-2xl { border-top-left-radius: var(--r-2xl); border-bottom-left-radius: var(--r-2xl); }
.rounded-l-3xl { border-top-left-radius: var(--r-3xl); border-bottom-left-radius: var(--r-3xl); }


.rounded-tl-sm  { border-top-left-radius: var(--r-sm); }
.rounded-tl     { border-top-left-radius: var(--r); }
.rounded-tl-md  { border-top-left-radius: var(--r-md); }
.rounded-tl-lg  { border-top-left-radius: var(--r-lg); }
.rounded-tl-xl  { border-top-left-radius: var(--r-xl); }
.rounded-tl-2xl { border-top-left-radius: var(--r-2xl); }
.rounded-tl-3xl { border-top-left-radius: var(--r-3xl); }

.rounded-tr-sm  { border-top-right-radius: var(--r-sm); }
.rounded-tr     { border-top-right-radius: var(--r); }
.rounded-tr-md  { border-top-right-radius: var(--r-md); }
.rounded-tr-lg  { border-top-right-radius: var(--r-lg); }
.rounded-tr-xl  { border-top-right-radius: var(--r-xl); }
.rounded-tr-2xl { border-top-right-radius: var(--r-2xl); }
.rounded-tr-3xl { border-top-right-radius: var(--r-3xl); }

/* bottom */
.rounded-b-sm  {
    border-bottom-left-radius: var(--r-sm);
    border-bottom-right-radius: var(--r-sm);
}
.rounded-b     {
    border-bottom-left-radius: var(--r);
    border-bottom-right-radius: var(--r);
}
.rounded-b-md  {
    border-bottom-left-radius: var(--r-md);
    border-bottom-right-radius: var(--r-md);
}
.rounded-b-lg  {
    border-bottom-left-radius: var(--r-lg);
    border-bottom-right-radius: var(--r-lg);
}
.rounded-b-xl  {
    border-bottom-left-radius: var(--r-xl);
    border-bottom-right-radius: var(--r-xl);
}
.rounded-b-2xl {
    border-bottom-left-radius: var(--r-2xl);
    border-bottom-right-radius: var(--r-2xl);
}
.rounded-b-3xl {
    border-bottom-left-radius: var(--r-3xl);
    border-bottom-right-radius: var(--r-3xl);
}
.rounded-b-5xl {
    border-bottom-left-radius: var(--r-5xl);
    border-bottom-right-radius: var(--r-5xl);
}
.rounded-b-full {
    border-bottom-left-radius: var(--r-full);
    border-bottom-right-radius: var(--r-full);
}


.rounded-br-sm  { border-bottom-right-radius: var(--r-sm); }
.rounded-br     { border-bottom-right-radius: var(--r); }
.rounded-br-md  { border-bottom-right-radius: var(--r-md); }
.rounded-br-lg  { border-bottom-right-radius: var(--r-lg); }
.rounded-br-xl  { border-bottom-right-radius: var(--r-xl); }
.rounded-br-2xl { border-bottom-right-radius: var(--r-2xl); }
.rounded-br-3xl { border-bottom-right-radius: var(--r-3xl); }

.rounded-bl-sm  { border-bottom-left-radius: var(--r-sm); }
.rounded-bl     { border-bottom-left-radius: var(--r); }
.rounded-bl-md  { border-bottom-left-radius: var(--r-md); }
.rounded-bl-lg  { border-bottom-left-radius: var(--r-lg); }
.rounded-bl-xl  { border-bottom-left-radius: var(--r-xl); }
.rounded-bl-2xl { border-bottom-left-radius: var(--r-2xl); }
.rounded-bl-3xl { border-bottom-left-radius: var(--r-3xl); }
