/* Spacing Scale */
:root {
    --space-0: 0;
    --space-0-5: 0.125rem;
    --space-1: 0.25rem;
    --space-1-5: 0.375rem;
    --space-2: 0.5rem;
    --space-2-5: 0.625rem;
    --space-3: 0.75rem;
    --space-3-5: 0.875rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-7: 1.75rem;
    --space-8: 2rem;
    --space-9: 2.25rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-16: 4rem;
    --space-20: 5rem;
    --space-24: 6rem;
    --space-32: 8rem;
    --space-40: 10rem;
    --space-48: 12rem;
    --space-64: 16rem;
    --space-80: 20rem;
    --space-96: 24rem;
    --space-128: 32rem;
    --mobile: 20rem; /* 320px */
    --tablet: 40.0625rem; /* 641px */
    --desktop: 64rem; /* 1024px */
}

/* Margin */
.margin-0 { margin: var(--space-0); }
.margin-0-5 { margin: var(--space-0-5); }
.margin-1 { margin: var(--space-1); }
.margin-1-5 { margin: var(--space-1-5); }
.margin-2 { margin: var(--space-2); }
.margin-2-5 { margin: var(--space-2-5); }
.margin-3 { margin: var(--space-3); }
.margin-3-5 { margin: var(--space-3-5); }
.margin-4 { margin: var(--space-4); }
.margin-5 { margin: var(--space-5); }
.margin-6 { margin: var(--space-6); }
.margin-7 { margin: var(--space-7); }
.margin-8 { margin: var(--space-8); }
.margin-9 { margin: var(--space-9); }
.margin-10 { margin: var(--space-10); }
.margin-12 { margin: var(--space-12); }
.margin-16 { margin: var(--space-16); }
.margin-20 { margin: var(--space-20); }
.margin-24 { margin: var(--space-24); }
.margin-32 { margin: var(--space-32); }
.margin-40 { margin: var(--space-40); }
.margin-48 { margin: var(--space-48); }
.margin-64 { margin: var(--space-64); }
.margin-80 { margin: var(--space-80); }
.margin-96 { margin: var(--space-96); }



/* Margin X (Horizontal) */
.margin-x-0 { margin-left: var(--space-0); margin-right: var(--space-0); }
.margin-x-0-5 { margin-left: var(--space-0-5); margin-right: var(--space-0-5); }
.margin-x-1 { margin-left: var(--space-1); margin-right: var(--space-1); }
.margin-x-1-5 { margin-left: var(--space-1-5); margin-right: var(--space-1-5); }
.margin-x-2 { margin-left: var(--space-2); margin-right: var(--space-2); }
.margin-x-2-5 { margin-left: var(--space-2-5); margin-right: var(--space-2-5); }
.margin-x-3 { margin-left: var(--space-3); margin-right: var(--space-3); }
.margin-x-3-5 { margin-left: var(--space-3-5); margin-right: var(--space-3-5); }
.margin-x-4 { margin-left: var(--space-4); margin-right: var(--space-4); }
.margin-x-5 { margin-left: var(--space-5); margin-right: var(--space-5); }
.margin-x-6 { margin-left: var(--space-6); margin-right: var(--space-6); }
.margin-x-7 { margin-left: var(--space-7); margin-right: var(--space-7); }
.margin-x-8 { margin-left: var(--space-8); margin-right: var(--space-8); }
.margin-x-9 { margin-left: var(--space-9); margin-right: var(--space-9); }
.margin-x-10 { margin-left: var(--space-10); margin-right: var(--space-10); }
.margin-x-12 { margin-left: var(--space-12); margin-right: var(--space-12); }
.margin-x-16 { margin-left: var(--space-16); margin-right: var(--space-16); }
.margin-x-20 { margin-left: var(--space-20); margin-right: var(--space-20); }
.margin-x-24 { margin-left: var(--space-24); margin-right: var(--space-24); }
.margin-x-32 { margin-left: var(--space-32); margin-right: var(--space-32); }
.margin-x-40 { margin-left: var(--space-40); margin-right: var(--space-40); }
.margin-x-48 { margin-left: var(--space-48); margin-right: var(--space-48); }
.margin-x-64 { margin-left: var(--space-64); margin-right: var(--space-64); }
.margin-x-80 { margin-left: var(--space-80); margin-right: var(--space-80); }
.margin-x-96 { margin-left: var(--space-96); margin-right: var(--space-96); }
.margin-x-128 { margin-left: var(--space-128); margin-right: var(--space-128); }

/* Margin Y (Vertical) */
.margin-y-0 { margin-top: var(--space-0); margin-bottom: var(--space-0); }
.margin-y-0-5 { margin-top: var(--space-0-5); margin-bottom: var(--space-0-5); }
.margin-y-1 { margin-top: var(--space-1); margin-bottom: var(--space-1); }
.margin-y-1-5 { margin-top: var(--space-1-5); margin-bottom: var(--space-1-5); }
.margin-y-2 { margin-top: var(--space-2); margin-bottom: var(--space-2); }
.margin-y-2-5 { margin-top: var(--space-2-5); margin-bottom: var(--space-2-5); }
.margin-y-3 { margin-top: var(--space-3); margin-bottom: var(--space-3); }
.margin-y-3-5 { margin-top: var(--space-3-5); margin-bottom: var(--space-3-5); }
.margin-y-4 { margin-top: var(--space-4); margin-bottom: var(--space-4); }
.margin-y-5 { margin-top: var(--space-5); margin-bottom: var(--space-5); }
.margin-y-6 { margin-top: var(--space-6); margin-bottom: var(--space-6); }
.margin-y-7 { margin-top: var(--space-7); margin-bottom: var(--space-7); }
.margin-y-8 { margin-top: var(--space-8); margin-bottom: var(--space-8); }
.margin-y-9 { margin-top: var(--space-9); margin-bottom: var(--space-9); }
.margin-y-10 { margin-top: var(--space-10); margin-bottom: var(--space-10); }
.margin-y-12 { margin-top: var(--space-12); margin-bottom: var(--space-12); }
.margin-y-16 { margin-top: var(--space-16); margin-bottom: var(--space-16); }
.margin-y-20 { margin-top: var(--space-20); margin-bottom: var(--space-20); }
.margin-y-24 { margin-top: var(--space-24); margin-bottom: var(--space-24); }
.margin-y-32 { margin-top: var(--space-32); margin-bottom: var(--space-32); }
.margin-y-40 { margin-top: var(--space-40); margin-bottom: var(--space-40); }
.margin-y-48 { margin-top: var(--space-48); margin-bottom: var(--space-48); }
.margin-y-64 { margin-top: var(--space-64); margin-bottom: var(--space-64); }
.margin-y-80 { margin-top: var(--space-80); margin-bottom: var(--space-80); }
.margin-y-96 { margin-top: var(--space-96); margin-bottom: var(--space-96); }
.margin-y-128 { margin-top: var(--space-128); margin-bottom: var(--space-128); }


.margin-128 { margin: var(--space-128); }
.margin-top-0 { margin-top: var(--space-0); }
.margin-top-0-5 { margin-top: var(--space-0-5); }
.margin-top-1 { margin-top: var(--space-1); }
.margin-top-1-5 { margin-top: var(--space-1-5); }
.margin-top-2 { margin-top: var(--space-2); }
.margin-top-2-5 { margin-top: var(--space-2-5); }
.margin-top-3 { margin-top: var(--space-3); }
.margin-top-3-5 { margin-top: var(--space-3-5); }
.margin-top-4 { margin-top: var(--space-4); }
.margin-top-5 { margin-top: var(--space-5); }
.margin-top-6 { margin-top: var(--space-6); }
.margin-top-7 { margin-top: var(--space-7); }
.margin-top-8 { margin-top: var(--space-8); }
.margin-top-9 { margin-top: var(--space-9); }
.margin-top-10 { margin-top: var(--space-10); }
.margin-top-12 { margin-top: var(--space-12); }
.margin-top-16 { margin-top: var(--space-16); }
.margin-top-20 { margin-top: var(--space-20); }
.margin-top-24 { margin-top: var(--space-24); }
.margin-top-32 { margin-top: var(--space-32); }
.margin-top-40 { margin-top: var(--space-40); }
.margin-top-48 { margin-top: var(--space-48); }
.margin-top-64 { margin-top: var(--space-64); }
.margin-top-80 { margin-top: var(--space-80); }
.margin-top-96 { margin-top: var(--space-96); }
.margin-top-128 { margin-top: var(--space-128); }
.margin-right-0 { margin-right: var(--space-0); }
.margin-right-0-5 { margin-right: var(--space-0-5); }
.margin-right-1 { margin-right: var(--space-1); }
.margin-right-1-5 { margin-right: var(--space-1-5); }
.margin-right-2 { margin-right: var(--space-2); }
.margin-right-2-5 { margin-right: var(--space-2-5); }
.margin-right-3 { margin-right: var(--space-3); }
.margin-right-3-5 { margin-right: var(--space-3-5); }
.margin-right-4 { margin-right: var(--space-4); }
.margin-right-5 { margin-right: var(--space-5); }
.margin-right-6 { margin-right: var(--space-6); }
.margin-right-7 { margin-right: var(--space-7); }
.margin-right-8 { margin-right: var(--space-8); }
.margin-right-9 { margin-right: var(--space-9); }
.margin-right-10 { margin-right: var(--space-10); }
.margin-right-12 { margin-right: var(--space-12); }
.margin-right-16 { margin-right: var(--space-16); }
.margin-right-20 { margin-right: var(--space-20); }
.margin-right-24 { margin-right: var(--space-24); }
.margin-right-32 { margin-right: var(--space-32); }
.margin-right-40 { margin-right: var(--space-40); }
.margin-right-48 { margin-right: var(--space-48); }
.margin-right-64 { margin-right: var(--space-64); }
.margin-right-80 { margin-right: var(--space-80); }
.margin-right-96 { margin-right: var(--space-96); }
.margin-right-128 { margin-right: var(--space-128); }
.margin-bottom-0 { margin-bottom: var(--space-0); }
.margin-bottom-0-5 { margin-bottom: var(--space-0-5); }
.margin-bottom-1 { margin-bottom: var(--space-1); }
.margin-bottom-1-5 { margin-bottom: var(--space-1-5); }
.margin-bottom-2 { margin-bottom: var(--space-2); }
.margin-bottom-2-5 { margin-bottom: var(--space-2-5); }
.margin-bottom-3 { margin-bottom: var(--space-3); }
.margin-bottom-3-5 { margin-bottom: var(--space-3-5); }
.margin-bottom-4 { margin-bottom: var(--space-4); }
.margin-bottom-5 { margin-bottom: var(--space-5); }
.margin-bottom-6 { margin-bottom: var(--space-6); }
.margin-bottom-7 { margin-bottom: var(--space-7); }
.margin-bottom-8 { margin-bottom: var(--space-8); }
.margin-bottom-9 { margin-bottom: var(--space-9); }
.margin-bottom-10 { margin-bottom: var(--space-10); }
.margin-bottom-12 { margin-bottom: var(--space-12); }
.margin-bottom-16 { margin-bottom: var(--space-16); }
.margin-bottom-20 { margin-bottom: var(--space-20); }
.margin-bottom-24 { margin-bottom: var(--space-24); }
.margin-bottom-32 { margin-bottom: var(--space-32); }
.margin-bottom-40 { margin-bottom: var(--space-40); }
.margin-bottom-48 { margin-bottom: var(--space-48); }
.margin-bottom-64 { margin-bottom: var(--space-64); }
.margin-bottom-80 { margin-bottom: var(--space-80); }
.margin-bottom-96 { margin-bottom: var(--space-96); }
.margin-bottom-128 { margin-bottom: var(--space-128); }
.margin-left-0 { margin-left: var(--space-0); }
.margin-left-0-5 { margin-left: var(--space-0-5); }
.margin-left-1 { margin-left: var(--space-1); }
.margin-left-1-5 { margin-left: var(--space-1-5); }
.margin-left-2 { margin-left: var(--space-2); }
.margin-left-2-5 { margin-left: var(--space-2-5); }
.margin-left-3 { margin-left: var(--space-3); }
.margin-left-3-5 { margin-left: var(--space-3-5); }
.margin-left-4 { margin-left: var(--space-4); }
.margin-left-5 { margin-left: var(--space-5); }
.margin-left-6 { margin-left: var(--space-6); }
.margin-left-7 { margin-left: var(--space-7); }
.margin-left-8 { margin-left: var(--space-8); }
.margin-left-9 { margin-left: var(--space-9); }
.margin-left-10 { margin-left: var(--space-10); }
.margin-left-12 { margin-left: var(--space-12); }
.margin-left-16 { margin-left: var(--space-16); }
.margin-left-20 { margin-left: var(--space-20); }
.margin-left-24 { margin-left: var(--space-24); }
.margin-left-32 { margin-left: var(--space-32); }
.margin-left-40 { margin-left: var(--space-40); }
.margin-left-48 { margin-left: var(--space-48); }
.margin-left-64 { margin-left: var(--space-64); }
.margin-left-80 { margin-left: var(--space-80); }
.margin-left-96 { margin-left: var(--space-96); }
.margin-left-128 { margin-left: var(--space-128); }

/* Negative Margin */

.-margin-0 { margin: calc(var(--space-0) * -1); }
.-margin-x-0 { margin-left: calc(var(--space-0) * -1); margin-right: calc(var(--space-0) * -1); }
.-margin-y-0 { margin-top: calc(var(--space-0) * -1); margin-bottom: calc(var(--space-0) * -1); }
.-margin-top-0 { margin-top: calc(var(--space-0) * -1); }
.-margin-right-0 { margin-right: calc(var(--space-0) * -1); }
.-margin-bottom-0 { margin-bottom: calc(var(--space-0) * -1); }
.-margin-left-0 { margin-left: calc(var(--space-0) * -1); }
.-margin-0-5 { margin: calc(var(--space-0-5) * -1); }
.-margin-x-0-5 { margin-left: calc(var(--space-0-5) * -1); margin-right: calc(var(--space-0-5) * -1); }
.-margin-y-0-5 { margin-top: calc(var(--space-0-5) * -1); margin-bottom: calc(var(--space-0-5) * -1); }
.-margin-top-0-5 { margin-top: calc(var(--space-0-5) * -1); }
.-margin-right-0-5 { margin-right: calc(var(--space-0-5) * -1); }
.-margin-bottom-0-5 { margin-bottom: calc(var(--space-0-5) * -1); }
.-margin-left-0-5 { margin-left: calc(var(--space-0-5) * -1); }
.-margin-1 { margin: calc(var(--space-1) * -1); }
.-margin-x-1 { margin-left: calc(var(--space-1) * -1); margin-right: calc(var(--space-1) * -1); }
.-margin-y-1 { margin-top: calc(var(--space-1) * -1); margin-bottom: calc(var(--space-1) * -1); }
.-margin-top-1 { margin-top: calc(var(--space-1) * -1); }
.-margin-right-1 { margin-right: calc(var(--space-1) * -1); }
.-margin-bottom-1 { margin-bottom: calc(var(--space-1) * -1); }
.-margin-left-1 { margin-left: calc(var(--space-1) * -1); }
.-margin-1-5 { margin: calc(var(--space-1-5) * -1); }
.-margin-x-1-5 { margin-left: calc(var(--space-1-5) * -1); margin-right: calc(var(--space-1-5) * -1); }
.-margin-y-1-5 { margin-top: calc(var(--space-1-5) * -1); margin-bottom: calc(var(--space-1-5) * -1); }
.-margin-top-1-5 { margin-top: calc(var(--space-1-5) * -1); }
.-margin-right-1-5 { margin-right: calc(var(--space-1-5) * -1); }
.-margin-bottom-1-5 { margin-bottom: calc(var(--space-1-5) * -1); }
.-margin-left-1-5 { margin-left: calc(var(--space-1-5) * -1); }
.-margin-2 { margin: calc(var(--space-2) * -1); }
.-margin-x-2 { margin-left: calc(var(--space-2) * -1); margin-right: calc(var(--space-2) * -1); }
.-margin-y-2 { margin-top: calc(var(--space-2) * -1); margin-bottom: calc(var(--space-2) * -1); }
.-margin-top-2 { margin-top: calc(var(--space-2) * -1); }
.-margin-right-2 { margin-right: calc(var(--space-2) * -1); }
.-margin-bottom-2 { margin-bottom: calc(var(--space-2) * -1); }
.-margin-left-2 { margin-left: calc(var(--space-2) * -1); }
.-margin-2-5 { margin: calc(var(--space-2-5) * -1); }
.-margin-x-2-5 { margin-left: calc(var(--space-2-5) * -1); margin-right: calc(var(--space-2-5) * -1); }
.-margin-y-2-5 { margin-top: calc(var(--space-2-5) * -1); margin-bottom: calc(var(--space-2-5) * -1); }
.-margin-top-2-5 { margin-top: calc(var(--space-2-5) * -1); }
.-margin-right-2-5 { margin-right: calc(var(--space-2-5) * -1); }
.-margin-bottom-2-5 { margin-bottom: calc(var(--space-2-5) * -1); }
.-margin-left-2-5 { margin-left: calc(var(--space-2-5) * -1); }
.-margin-3 { margin: calc(var(--space-3) * -1); }
.-margin-x-3 { margin-left: calc(var(--space-3) * -1); margin-right: calc(var(--space-3) * -1); }
.-margin-y-3 { margin-top: calc(var(--space-3) * -1); margin-bottom: calc(var(--space-3) * -1); }
.-margin-top-3 { margin-top: calc(var(--space-3) * -1); }
.-margin-right-3 { margin-right: calc(var(--space-3) * -1); }
.-margin-bottom-3 { margin-bottom: calc(var(--space-3) * -1); }
.-margin-left-3 { margin-left: calc(var(--space-3) * -1); }
.-margin-3-5 { margin: calc(var(--space-3-5) * -1); }
.-margin-x-3-5 { margin-left: calc(var(--space-3-5) * -1); margin-right: calc(var(--space-3-5) * -1); }
.-margin-y-3-5 { margin-top: calc(var(--space-3-5) * -1); margin-bottom: calc(var(--space-3-5) * -1); }
.-margin-top-3-5 { margin-top: calc(var(--space-3-5) * -1); }
.-margin-right-3-5 { margin-right: calc(var(--space-3-5) * -1); }
.-margin-bottom-3-5 { margin-bottom: calc(var(--space-3-5) * -1); }
.-margin-left-3-5 { margin-left: calc(var(--space-3-5) * -1); }
.-margin-4 { margin: calc(var(--space-4) * -1); }
.-margin-x-4 { margin-left: calc(var(--space-4) * -1); margin-right: calc(var(--space-4) * -1); }
.-margin-y-4 { margin-top: calc(var(--space-4) * -1); margin-bottom: calc(var(--space-4) * -1); }
.-margin-top-4 { margin-top: calc(var(--space-4) * -1); }
.-margin-right-4 { margin-right: calc(var(--space-4) * -1); }
.-margin-bottom-4 { margin-bottom: calc(var(--space-4) * -1); }
.-margin-left-4 { margin-left: calc(var(--space-4) * -1); }
.-margin-5 { margin: calc(var(--space-5) * -1); }
.-margin-x-5 { margin-left: calc(var(--space-5) * -1); margin-right: calc(var(--space-5) * -1); }
.-margin-y-5 { margin-top: calc(var(--space-5) * -1); margin-bottom: calc(var(--space-5) * -1); }
.-margin-top-5 { margin-top: calc(var(--space-5) * -1); }
.-margin-right-5 { margin-right: calc(var(--space-5) * -1); }
.-margin-bottom-5 { margin-bottom: calc(var(--space-5) * -1); }
.-margin-left-5 { margin-left: calc(var(--space-5) * -1); }
.-margin-6 { margin: calc(var(--space-6) * -1); }
.-margin-x-6 { margin-left: calc(var(--space-6) * -1); margin-right: calc(var(--space-6) * -1); }
.-margin-y-6 { margin-top: calc(var(--space-6) * -1); margin-bottom: calc(var(--space-6) * -1); }
.-margin-top-6 { margin-top: calc(var(--space-6) * -1); }
.-margin-right-6 { margin-right: calc(var(--space-6) * -1); }
.-margin-bottom-6 { margin-bottom: calc(var(--space-6) * -1); }
.-margin-left-6 { margin-left: calc(var(--space-6) * -1); }
.-margin-7 { margin: calc(var(--space-7) * -1); }
.-margin-x-7 { margin-left: calc(var(--space-7) * -1); margin-right: calc(var(--space-7) * -1); }
.-margin-y-7 { margin-top: calc(var(--space-7) * -1); margin-bottom: calc(var(--space-7) * -1); }
.-margin-top-7 { margin-top: calc(var(--space-7) * -1); }
.-margin-right-7 { margin-right: calc(var(--space-7) * -1); }
.-margin-bottom-7 { margin-bottom: calc(var(--space-7) * -1); }
.-margin-left-7 { margin-left: calc(var(--space-7) * -1); }
.-margin-8 { margin: calc(var(--space-8) * -1); }
.-margin-x-8 { margin-left: calc(var(--space-8) * -1); margin-right: calc(var(--space-8) * -1); }
.-margin-y-8 { margin-top: calc(var(--space-8) * -1); margin-bottom: calc(var(--space-8) * -1); }
.-margin-top-8 { margin-top: calc(var(--space-8) * -1); }
.-margin-right-8 { margin-right: calc(var(--space-8) * -1); }
.-margin-bottom-8 { margin-bottom: calc(var(--space-8) * -1); }
.-margin-left-8 { margin-left: calc(var(--space-8) * -1); }
.-margin-9 { margin: calc(var(--space-9) * -1); }
.-margin-x-9 { margin-left: calc(var(--space-9) * -1); margin-right: calc(var(--space-9) * -1); }
.-margin-y-9 { margin-top: calc(var(--space-9) * -1); margin-bottom: calc(var(--space-9) * -1); }
.-margin-top-9 { margin-top: calc(var(--space-9) * -1); }
.-margin-right-9 { margin-right: calc(var(--space-9) * -1); }
.-margin-bottom-9 { margin-bottom: calc(var(--space-9) * -1); }
.-margin-left-9 { margin-left: calc(var(--space-9) * -1); }
.-margin-10 { margin: calc(var(--space-10) * -1); }
.-margin-x-10 { margin-left: calc(var(--space-10) * -1); margin-right: calc(var(--space-10) * -1); }
.-margin-y-10 { margin-top: calc(var(--space-10) * -1); margin-bottom: calc(var(--space-10) * -1); }
.-margin-top-10 { margin-top: calc(var(--space-10) * -1); }
.-margin-right-10 { margin-right: calc(var(--space-10) * -1); }
.-margin-bottom-10 { margin-bottom: calc(var(--space-10) * -1); }
.-margin-left-10 { margin-left: calc(var(--space-10) * -1); }
.-margin-12 { margin: calc(var(--space-12) * -1); }
.-margin-x-12 { margin-left: calc(var(--space-12) * -1); margin-right: calc(var(--space-12) * -1); }
.-margin-y-12 { margin-top: calc(var(--space-12) * -1); margin-bottom: calc(var(--space-12) * -1); }
.-margin-top-12 { margin-top: calc(var(--space-12) * -1); }
.-margin-right-12 { margin-right: calc(var(--space-12) * -1); }
.-margin-bottom-12 { margin-bottom: calc(var(--space-12) * -1); }
.-margin-left-12 { margin-left: calc(var(--space-12) * -1); }
.-margin-16 { margin: calc(var(--space-16) * -1); }
.-margin-x-16 { margin-left: calc(var(--space-16) * -1); margin-right: calc(var(--space-16) * -1); }
.-margin-y-16 { margin-top: calc(var(--space-16) * -1); margin-bottom: calc(var(--space-16) * -1); }
.-margin-top-16 { margin-top: calc(var(--space-16) * -1); }
.-margin-right-16 { margin-right: calc(var(--space-16) * -1); }
.-margin-bottom-16 { margin-bottom: calc(var(--space-16) * -1); }
.-margin-left-16 { margin-left: calc(var(--space-16) * -1); }
.-margin-20 { margin: calc(var(--space-20) * -1); }
.-margin-x-20 { margin-left: calc(var(--space-20) * -1); margin-right: calc(var(--space-20) * -1); }
.-margin-y-20 { margin-top: calc(var(--space-20) * -1); margin-bottom: calc(var(--space-20) * -1); }
.-margin-top-20 { margin-top: calc(var(--space-20) * -1); }
.-margin-right-20 { margin-right: calc(var(--space-20) * -1); }
.-margin-bottom-20 { margin-bottom: calc(var(--space-20) * -1); }
.-margin-left-20 { margin-left: calc(var(--space-20) * -1); }
.-margin-24 { margin: calc(var(--space-24) * -1); }
.-margin-x-24 { margin-left: calc(var(--space-24) * -1); margin-right: calc(var(--space-24) * -1); }
.-margin-y-24 { margin-top: calc(var(--space-24) * -1); margin-bottom: calc(var(--space-24) * -1); }
.-margin-top-24 { margin-top: calc(var(--space-24) * -1); }
.-margin-right-24 { margin-right: calc(var(--space-24) * -1); }
.-margin-bottom-24 { margin-bottom: calc(var(--space-24) * -1); }
.-margin-left-24 { margin-left: calc(var(--space-24) * -1); }
.-margin-32 { margin: calc(var(--space-32) * -1); }
.-margin-x-32 { margin-left: calc(var(--space-32) * -1); margin-right: calc(var(--space-32) * -1); }
.-margin-y-32 { margin-top: calc(var(--space-32) * -1); margin-bottom: calc(var(--space-32) * -1); }
.-margin-top-32 { margin-top: calc(var(--space-32) * -1); }
.-margin-right-32 { margin-right: calc(var(--space-32) * -1); }
.-margin-bottom-32 { margin-bottom: calc(var(--space-32) * -1); }
.-margin-left-32 { margin-left: calc(var(--space-32) * -1); }
.-margin-40 { margin: calc(var(--space-40) * -1); }
.-margin-x-40 { margin-left: calc(var(--space-40) * -1); margin-right: calc(var(--space-40) * -1); }
.-margin-y-40 { margin-top: calc(var(--space-40) * -1); margin-bottom: calc(var(--space-40) * -1); }
.-margin-top-40 { margin-top: calc(var(--space-40) * -1); }
.-margin-right-40 { margin-right: calc(var(--space-40) * -1); }
.-margin-bottom-40 { margin-bottom: calc(var(--space-40) * -1); }
.-margin-left-40 { margin-left: calc(var(--space-40) * -1); }
.-margin-48 { margin: calc(var(--space-48) * -1); }
.-margin-x-48 { margin-left: calc(var(--space-48) * -1); margin-right: calc(var(--space-48) * -1); }
.-margin-y-48 { margin-top: calc(var(--space-48) * -1); margin-bottom: calc(var(--space-48) * -1); }
.-margin-top-48 { margin-top: calc(var(--space-48) * -1); }
.-margin-right-48 { margin-right: calc(var(--space-48) * -1); }
.-margin-bottom-48 { margin-bottom: calc(var(--space-48) * -1); }
.-margin-left-48 { margin-left: calc(var(--space-48) * -1); }
.-margin-64 { margin: calc(var(--space-64) * -1); }
.-margin-x-64 { margin-left: calc(var(--space-64) * -1); margin-right: calc(var(--space-64) * -1); }
.-margin-y-64 { margin-top: calc(var(--space-64) * -1); margin-bottom: calc(var(--space-64) * -1); }
.-margin-top-64 { margin-top: calc(var(--space-64) * -1); }
.-margin-right-64 { margin-right: calc(var(--space-64) * -1); }
.-margin-bottom-64 { margin-bottom: calc(var(--space-64) * -1); }
.-margin-left-64 { margin-left: calc(var(--space-64) * -1); }
.-margin-80 { margin: calc(var(--space-80) * -1); }
.-margin-x-80 { margin-left: calc(var(--space-80) * -1); margin-right: calc(var(--space-80) * -1); }
.-margin-y-80 { margin-top: calc(var(--space-80) * -1); margin-bottom: calc(var(--space-80) * -1); }
.-margin-top-80 { margin-top: calc(var(--space-80) * -1); }
.-margin-right-80 { margin-right: calc(var(--space-80) * -1); }
.-margin-bottom-80 { margin-bottom: calc(var(--space-80) * -1); }
.-margin-left-80 { margin-left: calc(var(--space-80) * -1); }
.-margin-96 { margin: calc(var(--space-96) * -1); }
.-margin-x-96 { margin-left: calc(var(--space-96) * -1); margin-right: calc(var(--space-96) * -1); }
.-margin-y-96 { margin-top: calc(var(--space-96) * -1); margin-bottom: calc(var(--space-96) * -1); }
.-margin-top-96 { margin-top: calc(var(--space-96) * -1); }
.-margin-right-96 { margin-right: calc(var(--space-96) * -1); }
.-margin-bottom-96 { margin-bottom: calc(var(--space-96) * -1); }
.-margin-left-96 { margin-left: calc(var(--space-96) * -1); }
.-margin-128 { margin: calc(var(--space-128) * -1); }
.-margin-x-128 { margin-left: calc(var(--space-128) * -1); margin-right: calc(var(--space-128) * -1); }
.-margin-y-128 { margin-top: calc(var(--space-128) * -1); margin-bottom: calc(var(--space-128) * -1); }
.-margin-top-128 { margin-top: calc(var(--space-128) * -1); }
.-margin-right-128 { margin-right: calc(var(--space-128) * -1); }
.-margin-bottom-128 { margin-bottom: calc(var(--space-128) * -1); }
.-margin-left-128 { margin-left: calc(var(--space-128) * -1); }


/* Padding */
.padding-0 { padding: var(--space-0); }
.padding-0-5 { padding: var(--space-0-5); }
.padding-1 { padding: var(--space-1); }
.padding-1-5 { padding: var(--space-1-5); }
.padding-2 { padding: var(--space-2); }
.padding-2-5 { padding: var(--space-2-5); }
.padding-3 { padding: var(--space-3); }
.padding-3-5 { padding: var(--space-3-5); }
.padding-4 { padding: var(--space-4); }
.padding-5 { padding: var(--space-5); }
.padding-6 { padding: var(--space-6); }
.padding-7 { padding: var(--space-7); }
.padding-8 { padding: var(--space-8); }
.padding-9 { padding: var(--space-9); }
.padding-10 { padding: var(--space-10); }
.padding-12 { padding: var(--space-12); }
.padding-16 { padding: var(--space-16); }
.padding-20 { padding: var(--space-20); }
.padding-24 { padding: var(--space-24); }
.padding-32 { padding: var(--space-32); }
.padding-40 { padding: var(--space-40); }
.padding-48 { padding: var(--space-48); }
.padding-64 { padding: var(--space-64); }
.padding-80 { padding: var(--space-80); }
.padding-96 { padding: var(--space-96); }

/* Padding X (Horizontal) */
.padding-x-0 { padding-left: var(--space-0); padding-right: var(--space-0); }
.padding-x-0-5 { padding-left: var(--space-0-5); padding-right: var(--space-0-5); }
.padding-x-1 { padding-left: var(--space-1); padding-right: var(--space-1); }
.padding-x-1-5 { padding-left: var(--space-1-5); padding-right: var(--space-1-5); }
.padding-x-2 { padding-left: var(--space-2); padding-right: var(--space-2); }
.padding-x-2-5 { padding-left: var(--space-2-5); padding-right: var(--space-2-5); }
.padding-x-3 { padding-left: var(--space-3); padding-right: var(--space-3); }
.padding-x-3-5 { padding-left: var(--space-3-5); padding-right: var(--space-3-5); }
.padding-x-4 { padding-left: var(--space-4); padding-right: var(--space-4); }
.padding-x-5 { padding-left: var(--space-5); padding-right: var(--space-5); }
.padding-x-6 { padding-left: var(--space-6); padding-right: var(--space-6); }
.padding-x-7 { padding-left: var(--space-7); padding-right: var(--space-7); }
.padding-x-8 { padding-left: var(--space-8); padding-right: var(--space-8); }
.padding-x-9 { padding-left: var(--space-9); padding-right: var(--space-9); }
.padding-x-10 { padding-left: var(--space-10); padding-right: var(--space-10); }
.padding-x-12 { padding-left: var(--space-12); padding-right: var(--space-12); }
.padding-x-16 { padding-left: var(--space-16); padding-right: var(--space-16); }
.padding-x-20 { padding-left: var(--space-20); padding-right: var(--space-20); }
.padding-x-24 { padding-left: var(--space-24); padding-right: var(--space-24); }
.padding-x-32 { padding-left: var(--space-32); padding-right: var(--space-32); }
.padding-x-40 { padding-left: var(--space-40); padding-right: var(--space-40); }
.padding-x-48 { padding-left: var(--space-48); padding-right: var(--space-48); }
.padding-x-64 { padding-left: var(--space-64); padding-right: var(--space-64); }
.padding-x-80 { padding-left: var(--space-80); padding-right: var(--space-80); }
.padding-x-96 { padding-left: var(--space-96); padding-right: var(--space-96); }
.padding-x-128 { padding-left: var(--space-128); padding-right: var(--space-128); }


/* Padding Y (Vertical) */
.padding-y-0 { padding-top: var(--space-0); padding-bottom: var(--space-0); }
.padding-y-0-5 { padding-top: var(--space-0-5); padding-bottom: var(--space-0-5); }
.padding-y-1 { padding-top: var(--space-1); padding-bottom: var(--space-1); }
.padding-y-1-5 { padding-top: var(--space-1-5); padding-bottom: var(--space-1-5); }
.padding-y-2 { padding-top: var(--space-2); padding-bottom: var(--space-2); }
.padding-y-2-5 { padding-top: var(--space-2-5); padding-bottom: var(--space-2-5); }
.padding-y-3 { padding-top: var(--space-3); padding-bottom: var(--space-3); }
.padding-y-3-5 { padding-top: var(--space-3-5); padding-bottom: var(--space-3-5); }
.padding-y-4 { padding-top: var(--space-4); padding-bottom: var(--space-4); }
.padding-y-5 { padding-top: var(--space-5); padding-bottom: var(--space-5); }
.padding-y-6 { padding-top: var(--space-6); padding-bottom: var(--space-6); }
.padding-y-7 { padding-top: var(--space-7); padding-bottom: var(--space-7); }
.padding-y-8 { padding-top: var(--space-8); padding-bottom: var(--space-8); }
.padding-y-9 { padding-top: var(--space-9); padding-bottom: var(--space-9); }
.padding-y-10 { padding-top: var(--space-10); padding-bottom: var(--space-10); }
.padding-y-12 { padding-top: var(--space-12); padding-bottom: var(--space-12); }
.padding-y-16 { padding-top: var(--space-16); padding-bottom: var(--space-16); }
.padding-y-20 { padding-top: var(--space-20); padding-bottom: var(--space-20); }
.padding-y-24 { padding-top: var(--space-24); padding-bottom: var(--space-24); }
.padding-y-32 { padding-top: var(--space-32); padding-bottom: var(--space-32); }
.padding-y-40 { padding-top: var(--space-40); padding-bottom: var(--space-40); }
.padding-y-48 { padding-top: var(--space-48); padding-bottom: var(--space-48); }
.padding-y-64 { padding-top: var(--space-64); padding-bottom: var(--space-64); }
.padding-y-80 { padding-top: var(--space-80); padding-bottom: var(--space-80); }
.padding-y-96 { padding-top: var(--space-96); padding-bottom: var(--space-96); }
.padding-y-128 { padding-top: var(--space-128); padding-bottom: var(--space-128); }

/* Negative Padding */
.-padding-0 { padding: calc(var(--space-0) * -1); }
.-padding-x-0 { padding-left: calc(var(--space-0) * -1); padding-right: calc(var(--space-0) * -1); }
.-padding-y-0 { padding-top: calc(var(--space-0) * -1); padding-bottom: calc(var(--space-0) * -1); }

.-padding-0-5 { padding: calc(var(--space-0-5) * -1); }
.-padding-x-0-5 { padding-left: calc(var(--space-0-5) * -1); padding-right: calc(var(--space-0-5) * -1); }
.-padding-y-0-5 { padding-top: calc(var(--space-0-5) * -1); padding-bottom: calc(var(--space-0-5) * -1); }

.-padding-1 { padding: calc(var(--space-1) * -1); }
.-padding-x-1 { padding-left: calc(var(--space-1) * -1); padding-right: calc(var(--space-1) * -1); }
.-padding-y-1 { padding-top: calc(var(--space-1) * -1); padding-bottom: calc(var(--space-1) * -1); }

.-padding-1-5 { padding: calc(var(--space-1-5) * -1); }
.-padding-x-1-5 { padding-left: calc(var(--space-1-5) * -1); padding-right: calc(var(--space-1-5) * -1); }
.-padding-y-1-5 { padding-top: calc(var(--space-1-5) * -1); padding-bottom: calc(var(--space-1-5) * -1); }

/* Continue for all other values... */


.padding-128 { padding: var(--space-128); }
.padding-top-0 { padding-top: var(--space-0); }
.padding-top-0-5 { padding-top: var(--space-0-5); }
.padding-top-1 { padding-top: var(--space-1); }
.padding-top-1-5 { padding-top: var(--space-1-5); }
.padding-top-2 { padding-top: var(--space-2); }
.padding-top-2-5 { padding-top: var(--space-2-5); }
.padding-top-3 { padding-top: var(--space-3); }
.padding-top-3-5 { padding-top: var(--space-3-5); }
.padding-top-4 { padding-top: var(--space-4); }
.padding-top-5 { padding-top: var(--space-5); }
.padding-top-6 { padding-top: var(--space-6); }
.padding-top-7 { padding-top: var(--space-7); }
.padding-top-8 { padding-top: var(--space-8); }
.padding-top-9 { padding-top: var(--space-9); }
.padding-top-10 { padding-top: var(--space-10); }
.padding-top-12 { padding-top: var(--space-12); }
.padding-top-16 { padding-top: var(--space-16); }
.padding-top-20 { padding-top: var(--space-20); }
.padding-top-24 { padding-top: var(--space-24); }
.padding-top-32 { padding-top: var(--space-32); }
.padding-top-40 { padding-top: var(--space-40); }
.padding-top-48 { padding-top: var(--space-48); }
.padding-top-64 { padding-top: var(--space-64); }
.padding-top-80 { padding-top: var(--space-80); }
.padding-top-96 { padding-top: var(--space-96); }
.padding-top-128 { padding-top: var(--space-128); }
.padding-right-0 { padding-right: var(--space-0); }
.padding-right-0-5 { padding-right: var(--space-0-5); }
.padding-right-1 { padding-right: var(--space-1); }
.padding-right-1-5 { padding-right: var(--space-1-5); }
.padding-right-2 { padding-right: var(--space-2); }
.padding-right-2-5 { padding-right: var(--space-2-5); }
.padding-right-3 { padding-right: var(--space-3); }
.padding-right-3-5 { padding-right: var(--space-3-5); }
.padding-right-4 { padding-right: var(--space-4); }
.padding-right-5 { padding-right: var(--space-5); }
.padding-right-6 { padding-right: var(--space-6); }
.padding-right-7 { padding-right: var(--space-7); }
.padding-right-8 { padding-right: var(--space-8); }
.padding-right-9 { padding-right: var(--space-9); }
.padding-right-10 { padding-right: var(--space-10); }
.padding-right-12 { padding-right: var(--space-12); }
.padding-right-16 { padding-right: var(--space-16); }
.padding-right-20 { padding-right: var(--space-20); }
.padding-right-24 { padding-right: var(--space-24); }
.padding-right-32 { padding-right: var(--space-32); }
.padding-right-40 { padding-right: var(--space-40); }
.padding-right-48 { padding-right: var(--space-48); }
.padding-right-64 { padding-right: var(--space-64); }
.padding-right-80 { padding-right: var(--space-80); }
.padding-right-96 { padding-right: var(--space-96); }
.padding-right-128 { padding-right: var(--space-128); }
.padding-bottom-0 { padding-bottom: var(--space-0); }
.padding-bottom-0-5 { padding-bottom: var(--space-0-5); }
.padding-bottom-1 { padding-bottom: var(--space-1); }
.padding-bottom-1-5 { padding-bottom: var(--space-1-5); }
.padding-bottom-2 { padding-bottom: var(--space-2); }
.padding-bottom-2-5 { padding-bottom: var(--space-2-5); }
.padding-bottom-3 { padding-bottom: var(--space-3); }
.padding-bottom-3-5 { padding-bottom: var(--space-3-5); }
.padding-bottom-4 { padding-bottom: var(--space-4); }
.padding-bottom-5 { padding-bottom: var(--space-5); }
.padding-bottom-6 { padding-bottom: var(--space-6); }
.padding-bottom-7 { padding-bottom: var(--space-7); }
.padding-bottom-8 { padding-bottom: var(--space-8); }
.padding-bottom-9 { padding-bottom: var(--space-9); }
.padding-bottom-10 { padding-bottom: var(--space-10); }
.padding-bottom-12 { padding-bottom: var(--space-12); }
.padding-bottom-16 { padding-bottom: var(--space-16); }
.padding-bottom-20 { padding-bottom: var(--space-20); }
.padding-bottom-24 { padding-bottom: var(--space-24); }
.padding-bottom-32 { padding-bottom: var(--space-32); }
.padding-bottom-40 { padding-bottom: var(--space-40); }
.padding-bottom-48 { padding-bottom: var(--space-48); }
.padding-bottom-64 { padding-bottom: var(--space-64); }
.padding-bottom-80 { padding-bottom: var(--space-80); }
.padding-bottom-96 { padding-bottom: var(--space-96); }
.padding-bottom-128 { padding-bottom: var(--space-128); }
.padding-left-0 { padding-left: var(--space-0); }
.padding-left-0-5 { padding-left: var(--space-0-5); }
.padding-left-1 { padding-left: var(--space-1); }
.padding-left-1-5 { padding-left: var(--space-1-5); }
.padding-left-2 { padding-left: var(--space-2); }
.padding-left-2-5 { padding-left: var(--space-2-5); }
.padding-left-3 { padding-left: var(--space-3); }
.padding-left-3-5 { padding-left: var(--space-3-5); }
.padding-left-4 { padding-left: var(--space-4); }
.padding-left-5 { padding-left: var(--space-5); }
.padding-left-6 { padding-left: var(--space-6); }
.padding-left-7 { padding-left: var(--space-7); }
.padding-left-8 { padding-left: var(--space-8); }
.padding-left-9 { padding-left: var(--space-9); }
.padding-left-10 { padding-left: var(--space-10); }
.padding-left-12 { padding-left: var(--space-12); }
.padding-left-16 { padding-left: var(--space-16); }
.padding-left-20 { padding-left: var(--space-20); }
.padding-left-24 { padding-left: var(--space-24); }
.padding-left-32 { padding-left: var(--space-32); }
.padding-left-40 { padding-left: var(--space-40); }
.padding-left-48 { padding-left: var(--space-48); }
.padding-left-64 { padding-left: var(--space-64); }
.padding-left-80 { padding-left: var(--space-80); }
.padding-left-96 { padding-left: var(--space-96); }
.padding-left-128 { padding-left: var(--space-128); }

/* Width */
.width-0 { width: var(--space-0); }
.width-0-5 { width: var(--space-0-5); }
.width-1 { width: var(--space-1); }
.width-1-5 { width: var(--space-1-5); }
.width-2 { width: var(--space-2); }
.width-2-5 { width: var(--space-2-5); }
.width-3 { width: var(--space-3); }
.width-3-5 { width: var(--space-3-5); }
.width-4 { width: var(--space-4); }
.width-5 { width: var(--space-5); }
.width-6 { width: var(--space-6); }
.width-7 { width: var(--space-7); }
.width-8 { width: var(--space-8); }
.width-9 { width: var(--space-9); }
.width-10 { width: var(--space-10); }
.width-12 { width: var(--space-12); }
.width-16 { width: var(--space-16); }
.width-20 { width: var(--space-20); }
.width-24 { width: var(--space-24); }
.width-32 { width: var(--space-32); }
.width-40 { width: var(--space-40); }
.width-48 { width: var(--space-48); }
.width-64 { width: var(--space-64); }
.width-80 { width: var(--space-80); }
.width-96 { width: var(--space-96); }
.width-128 { width: var(--space-128); }

/* Height */
.height-0 { height: var(--space-0); }
.height-0-5 { height: var(--space-0-5); }
.height-1 { height: var(--space-1); }
.height-1-5 { height: var(--space-1-5); }
.height-2 { height: var(--space-2); }
.height-2-5 { height: var(--space-2-5); }
.height-3 { height: var(--space-3); }
.height-3-5 { height: var(--space-3-5); }
.height-4 { height: var(--space-4); }
.height-5 { height: var(--space-5); }
.height-6 { height: var(--space-6); }
.height-7 { height: var(--space-7); }
.height-8 { height: var(--space-8); }
.height-9 { height: var(--space-9); }
.height-10 { height: var(--space-10); }
.height-12 { height: var(--space-12); }
.height-16 { height: var(--space-16); }
.height-20 { height: var(--space-20); }
.height-24 { height: var(--space-24); }
.height-32 { height: var(--space-32); }
.height-40 { height: var(--space-40); }
.height-48 { height: var(--space-48); }
.height-64 { height: var(--space-64); }
.height-80 { height: var(--space-80); }
.height-96 { height: var(--space-96); }
.height-128 { height: var(--space-128); }


/* Max Width */

.max-width-0 { max-width: var(--space-0); }
.max-width-0-5 { max-width: var(--space-0-5); }
.max-width-1 { max-width: var(--space-1); }
.max-width-1-5 { max-width: var(--space-1-5); }
.max-width-2 { max-width: var(--space-2); }
.max-width-2-5 { max-width: var(--space-2-5); }
.max-width-3 { max-width: var(--space-3); }
.max-width-3-5 { max-width: var(--space-3-5); }
.max-width-4 { max-width: var(--space-4); }
.max-width-5 { max-width: var(--space-5); }
.max-width-6 { max-width: var(--space-6); }
.max-width-7 { max-width: var(--space-7); }
.max-width-8 { max-width: var(--space-8); }
.max-width-9 { max-width: var(--space-9); }
.max-width-10 { max-width: var(--space-10); }
.max-width-12 { max-width: var(--space-12); }
.max-width-16 { max-width: var(--space-16); }
.max-width-20 { max-width: var(--space-20); }
.max-width-24 { max-width: var(--space-24); }
.max-width-32 { max-width: var(--space-32); }
.max-width-40 { max-width: var(--space-40); }
.max-width-48 { max-width: var(--space-48); }
.max-width-64 { max-width: var(--space-64); }
.max-width-80 { max-width: var(--space-80); }
.max-width-96 { max-width: var(--space-96); }
.max-width-128 { max-width: var(--space-128); }

/* Min Width */
.min-width-0 { min-width: var(--space-0); }
.min-width-0-5 { min-width: var(--space-0-5); }
.min-width-1 { min-width: var(--space-1); }
.min-width-1-5 { min-width: var(--space-1-5); }
.min-width-2 { min-width: var(--space-2); }
.min-width-2-5 { min-width: var(--space-2-5); }
.min-width-3 { min-width: var(--space-3); }
.min-width-3-5 { min-width: var(--space-3-5); }
.min-width-4 { min-width: var(--space-4); }
.min-width-5 { min-width: var(--space-5); }
.min-width-6 { min-width: var(--space-6); }
.min-width-7 { min-width: var(--space-7); }
.min-width-8 { min-width: var(--space-8); }
.min-width-9 { min-width: var(--space-9); }
.min-width-10 { min-width: var(--space-10); }
.min-width-12 { min-width: var(--space-12); }
.min-width-16 { min-width: var(--space-16); }
.min-width-20 { min-width: var(--space-20); }
.min-width-24 { min-width: var(--space-24); }
.min-width-32 { min-width: var(--space-32); }
.min-width-40 { min-width: var(--space-40); }
.min-width-48 { min-width: var(--space-48); }
.min-width-64 { min-width: var(--space-64); }
.min-width-80 { min-width: var(--space-80); }
.min-width-96 { min-width: var(--space-96); }
.min-width-128 { min-width: var(--space-128); }

/* Max Height */

.max-height-0 { max-height: var(--space-0); }
.max-height-0-5 { max-height: var(--space-0-5); }
.max-height-1 { max-height: var(--space-1); }
.max-height-1-5 { max-height: var(--space-1-5); }
.max-height-2 { max-height: var(--space-2); }
.max-height-2-5 { max-height: var(--space-2-5); }
.max-height-3 { max-height: var(--space-3); }
.max-height-3-5 { max-height: var(--space-3-5); }
.max-height-4 { max-height: var(--space-4); }
.max-height-5 { max-height: var(--space-5); }
.max-height-6 { max-height: var(--space-6); }
.max-height-7 { max-height: var(--space-7); }
.max-height-8 { max-height: var(--space-8); }
.max-height-9 { max-height: var(--space-9); }
.max-height-10 { max-height: var(--space-10); }
.max-height-12 { max-height: var(--space-12); }
.max-height-16 { max-height: var(--space-16); }
.max-height-20 { max-height: var(--space-20); }
.max-height-24 { max-height: var(--space-24); }
.max-height-32 { max-height: var(--space-32); }
.max-height-40 { max-height: var(--space-40); }
.max-height-48 { max-height: var(--space-48); }
.max-height-64 { max-height: var(--space-64); }
.max-height-80 { max-height: var(--space-80); }
.max-height-96 { max-height: var(--space-96); }
.max-height-128 { max-height: var(--space-128); }

/* Min Height */

.min-height-0 { min-height: var(--space-0); }
.min-height-0-5 { min-height: var(--space-0-5); }
.min-height-1 { min-height: var(--space-1); }
.min-height-1-5 { min-height: var(--space-1-5); }
.min-height-2 { min-height: var(--space-2); }
.min-height-2-5 { min-height: var(--space-2-5); }
.min-height-3 { min-height: var(--space-3); }
.min-height-3-5 { min-height: var(--space-3-5); }
.min-height-4 { min-height: var(--space-4); }
.min-height-5 { min-height: var(--space-5); }
.min-height-6 { min-height: var(--space-6); }
.min-height-7 { min-height: var(--space-7); }
.min-height-8 { min-height: var(--space-8); }
.min-height-9 { min-height: var(--space-9); }
.min-height-10 { min-height: var(--space-10); }
.min-height-12 { min-height: var(--space-12); }
.min-height-16 { min-height: var(--space-16); }
.min-height-20 { min-height: var(--space-20); }
.min-height-24 { min-height: var(--space-24); }
.min-height-32 { min-height: var(--space-32); }
.min-height-40 { min-height: var(--space-40); }
.min-height-48 { min-height: var(--space-48); }
.min-height-64 { min-height: var(--space-64); }
.min-height-80 { min-height: var(--space-80); }
.min-height-96 { min-height: var(--space-96); }
.min-height-128 { min-height: var(--space-128); }

/* Position */
.position-0 { top: var(--space-0); right: var(--space-0); bottom: var(--space-0); left: var(--space-0); }
.position-0-5 { top: var(--space-0-5); right: var(--space-0-5); bottom: var(--space-0-5); left: var(--space-0-5); }
.position-1 { top: var(--space-1); right: var(--space-1); bottom: var(--space-1); left: var(--space-1); }
.position-1-5 { top: var(--space-1-5); right: var(--space-1-5); bottom: var(--space-1-5); left: var(--space-1-5); }
.position-2 { top: var(--space-2); right: var(--space-2); bottom: var(--space-2); left: var(--space-2); }
.position-2-5 { top: var(--space-2-5); right: var(--space-2-5); bottom: var(--space-2-5); left: var(--space-2-5); }
.position-3 { top: var(--space-3); right: var(--space-3); bottom: var(--space-3); left: var(--space-3); }
.position-3-5 { top: var(--space-3-5); right: var(--space-3-5); bottom: var(--space-3-5); left: var(--space-3-5); }
.position-4 { top: var(--space-4); right: var(--space-4); bottom: var(--space-4); left: var(--space-4); }
.position-5 { top: var(--space-5); right: var(--space-5); bottom: var(--space-5); left: var(--space-5); }
.position-6 { top: var(--space-6); right: var(--space-6); bottom: var(--space-6); left: var(--space-6); }
.position-7 { top: var(--space-7); right: var(--space-7); bottom: var(--space-7); left: var(--space-7); }
.position-8 { top: var(--space-8); right: var(--space-8); bottom: var(--space-8); left: var(--space-8); }
.position-9 { top: var(--space-9); right: var(--space-9); bottom: var(--space-9); left: var(--space-9); }
.position-10 { top: var(--space-10); right: var(--space-10); bottom: var(--space-10); left: var(--space-10); }
.position-12 { top: var(--space-12); right: var(--space-12); bottom: var(--space-12); left: var(--space-12); }
.position-16 { top: var(--space-16); right: var(--space-16); bottom: var(--space-16); left: var(--space-16); }
.position-20 { top: var(--space-20); right: var(--space-20); bottom: var(--space-20); left: var(--space-20); }
.position-24 { top: var(--space-24); right: var(--space-24); bottom: var(--space-24); left: var(--space-24); }
.position-32 { top: var(--space-32); right: var(--space-32); bottom: var(--space-32); left: var(--space-32); }
.position-40 { top: var(--space-40); right: var(--space-40); bottom: var(--space-40); left: var(--space-40); }
.position-48 { top: var(--space-48); right: var(--space-48); bottom: var(--space-48); left: var(--space-48); }
.position-64 { top: var(--space-64); right: var(--space-64); bottom: var(--space-64); left: var(--space-64); }
.position-80 { top: var(--space-80); right: var(--space-80); bottom: var(--space-80); left: var(--space-80); }
.position-96 { top: var(--space-96); right: var(--space-96); bottom: var(--space-96); left: var(--space-96); }
.position-128 { top: var(--space-128); right: var(--space-128); bottom: var(--space-128); left: var(--space-128); }

/* Directional Positional Elements */

/* Position Top Utilities */
.position-top-0 { top: var(--space-0); }
.position-top-0-5 { top: var(--space-0-5); }
.position-top-1 { top: var(--space-1); }
.position-top-1-5 { top: var(--space-1-5); }
.position-top-2 { top: var(--space-2); }
.position-top-2-5 { top: var(--space-2-5); }
.position-top-3 { top: var(--space-3); }
.position-top-3-5 { top: var(--space-3-5); }
.position-top-4 { top: var(--space-4); }
.position-top-5 { top: var(--space-5); }
.position-top-6 { top: var(--space-6); }
.position-top-7 { top: var(--space-7); }
.position-top-8 { top: var(--space-8); }
.position-top-9 { top: var(--space-9); }
.position-top-10 { top: var(--space-10); }
.position-top-12 { top: var(--space-12); }
.position-top-16 { top: var(--space-16); }
.position-top-20 { top: var(--space-20); }
.position-top-24 { top: var(--space-24); }
.position-top-32 { top: var(--space-32); }
.position-top-40 { top: var(--space-40); }
.position-top-48 { top: var(--space-48); }
.position-top-64 { top: var(--space-64); }
.position-top-80 { top: var(--space-80); }
.position-top-96 { top: var(--space-96); }
.position-top-128 { top: var(--space-128); }

/* Position Right Utilities */
.position-right-0 { right: var(--space-0); }
.position-right-0-5 { right: var(--space-0-5); }
.position-right-1 { right: var(--space-1); }
.position-right-1-5 { right: var(--space-1-5); }
.position-right-2 { right: var(--space-2); }
.position-right-2-5 { right: var(--space-2-5); }
.position-right-3 { right: var(--space-3); }
.position-right-3-5 { right: var(--space-3-5); }
.position-right-4 { right: var(--space-4); }
.position-right-5 { right: var(--space-5); }
.position-right-6 { right: var(--space-6); }
.position-right-7 { right: var(--space-7); }
.position-right-8 { right: var(--space-8); }
.position-right-9 { right: var(--space-9); }
.position-right-10 { right: var(--space-10); }
.position-right-12 { right: var(--space-12); }
.position-right-16 { right: var(--space-16); }
.position-right-20 { right: var(--space-20); }
.position-right-24 { right: var(--space-24); }
.position-right-32 { right: var(--space-32); }
.position-right-40 { right: var(--space-40); }
.position-right-48 { right: var(--space-48); }
.position-right-64 { right: var(--space-64); }
.position-right-80 { right: var(--space-80); }
.position-right-96 { right: var(--space-96); }
.position-right-128 { right: var(--space-128); }

/* Position Bottom Utilities */
.position-bottom-0 { bottom: var(--space-0); }
.position-bottom-0-5 { bottom: var(--space-0-5); }
.position-bottom-1 { bottom: var(--space-1); }
.position-bottom-1-5 { bottom: var(--space-1-5); }
.position-bottom-2 { bottom: var(--space-2); }
.position-bottom-2-5 { bottom: var(--space-2-5); }
.position-bottom-3 { bottom: var(--space-3); }
.position-bottom-3-5 { bottom: var(--space-3-5); }
.position-bottom-4 { bottom: var(--space-4); }
.position-bottom-5 { bottom: var(--space-5); }
.position-bottom-6 { bottom: var(--space-6); }
.position-bottom-7 { bottom: var(--space-7); }
.position-bottom-8 { bottom: var(--space-8); }
.position-bottom-9 { bottom: var(--space-9); }
.position-bottom-10 { bottom: var(--space-10); }
.position-bottom-12 { bottom: var(--space-12); }
.position-bottom-16 { bottom: var(--space-16); }
.position-bottom-20 { bottom: var(--space-20); }
.position-bottom-24 { bottom: var(--space-24); }
.position-bottom-32 { bottom: var(--space-32); }
.position-bottom-40 { bottom: var(--space-40); }
.position-bottom-48 { bottom: var(--space-48); }
.position-bottom-64 { bottom: var(--space-64); }
.position-bottom-80 { bottom: var(--space-80); }
.position-bottom-96 { bottom: var(--space-96); }
.position-bottom-128 { bottom: var(--space-128); }

/* Position Left Utilities */
.position-left-0 { left: var(--space-0); }
.position-left-0-5 { left: var(--space-0-5); }
.position-left-1 { left: var(--space-1); }
.position-left-1-5 { left: var(--space-1-5); }
.position-left-2 { left: var(--space-2); }
.position-left-2-5 { left: var(--space-2-5); }
.position-left-3 { left: var(--space-3); }
.position-left-3-5 { left: var(--space-3-5); }
.position-left-4 { left: var(--space-4); }
.position-left-5 { left: var(--space-5); }
.position-left-6 { left: var(--space-6); }
.position-left-7 { left: var(--space-7); }
.position-left-8 { left: var(--space-8); }
.position-left-9 { left: var(--space-9); }
.position-left-10 { left: var(--space-10); }
.position-left-12 { left: var(--space-12); }
.position-left-16 { left: var(--space-16); }
.position-left-20 { left: var(--space-20); }
.position-left-24 { left: var(--space-24); }
.position-left-32 { left: var(--space-32); }
.position-left-40 { left: var(--space-40); }
.position-left-48 { left: var(--space-48); }
.position-left-64 { left: var(--space-64); }
.position-left-80 { left: var(--space-80); }
.position-left-96 { left: var(--space-96); }
.position-left-128 { left: var(--space-128); }

/* Position Utilities */
.position-static { position: static; }
.position-relative { position: relative; }
.position-absolute { position: absolute; }
.position-fixed { position: fixed; }
.position-sticky { position: sticky; }


/* Between Utilities (gap) */
.between-0 { gap: var(--space-0); }
.between-0-5 { gap: var(--space-0-5); }
.between-1 { gap: var(--space-1); }
.between-1-5 { gap: var(--space-1-5); }
.between-2 { gap: var(--space-2); }
.between-2-5 { gap: var(--space-2-5); }
.between-3 { gap: var(--space-3); }
.between-3-5 { gap: var(--space-3-5); }
.between-4 { gap: var(--space-4); }
.between-5 { gap: var(--space-5); }
.between-6 { gap: var(--space-6); }
.between-7 { gap: var(--space-7); }
.between-8 { gap: var(--space-8); }
.between-9 { gap: var(--space-9); }
.between-10 { gap: var(--space-10); }
.between-12 { gap: var(--space-12); }
.between-16 { gap: var(--space-16); }
.between-20 { gap: var(--space-20); }
.between-24 { gap: var(--space-24); }
.between-32 { gap: var(--space-32); }
.between-40 { gap: var(--space-40); }
.between-48 { gap: var(--space-48); }
.between-64 { gap: var(--space-64); }
.between-80 { gap: var(--space-80); }
.between-96 { gap: var(--space-96); }
.between-128 { gap: var(--space-128); }

/* Horizontal Gap (x-axis) Utilities */
.between-x-0 { column-gap: var(--space-0); }
.between-x-0-5 { column-gap: var(--space-0-5); }
.between-x-1 { column-gap: var(--space-1); }
.between-x-1-5 { column-gap: var(--space-1-5); }
.between-x-2 { column-gap: var(--space-2); }
.between-x-2-5 { column-gap: var(--space-2-5); }
.between-x-3 { column-gap: var(--space-3); }
.between-x-3-5 { column-gap: var(--space-3-5); }
.between-x-4 { column-gap: var(--space-4); }
.between-x-5 { column-gap: var(--space-5); }
.between-x-6 { column-gap: var(--space-6); }
.between-x-7 { column-gap: var(--space-7); }
.between-x-8 { column-gap: var(--space-8); }
.between-x-9 { column-gap: var(--space-9); }
.between-x-10 { column-gap: var(--space-10); }
.between-x-12 { column-gap: var(--space-12); }
.between-x-16 { column-gap: var(--space-16); }
.between-x-20 { column-gap: var(--space-20); }
.between-x-24 { column-gap: var(--space-24); }
.between-x-32 { column-gap: var(--space-32); }
.between-x-40 { column-gap: var(--space-40); }
.between-x-48 { column-gap: var(--space-48); }
.between-x-64 { column-gap: var(--space-64); }
.between-x-80 { column-gap: var(--space-80); }
.between-x-96 { column-gap: var(--space-96); }
.between-x-128 { column-gap: var(--space-128); }

/* Vertical Gap (y-axis) Utilities */
.between-y-0 { row-gap: var(--space-0); }
.between-y-0-5 { row-gap: var(--space-0-5); }
.between-y-1 { row-gap: var(--space-1); }
.between-y-1-5 { row-gap: var(--space-1-5); }
.between-y-2 { row-gap: var(--space-2); }
.between-y-2-5 { row-gap: var(--space-2-5); }
.between-y-3 { row-gap: var(--space-3); }
.between-y-3-5 { row-gap: var(--space-3-5); }
.between-y-4 { row-gap: var(--space-4); }
.between-y-5 { row-gap: var(--space-5); }
.between-y-6 { row-gap: var(--space-6); }
.between-y-7 { row-gap: var(--space-7); }
.between-y-8 { row-gap: var(--space-8); }
.between-y-9 { row-gap: var(--space-9); }
.between-y-10 { row-gap: var(--space-10); }
.between-y-12 { row-gap: var(--space-12); }
.between-y-16 { row-gap: var(--space-16); }
.between-y-20 { row-gap: var(--space-20); }
.between-y-24 { row-gap: var(--space-24); }
.between-y-32 { row-gap: var(--space-32); }
.between-y-40 { row-gap: var(--space-40); }
.between-y-48 { row-gap: var(--space-48); }
.between-y-64 { row-gap: var(--space-64); }
.between-y-80 { row-gap: var(--space-80); }
.between-y-96 { row-gap: var(--space-96); }
.between-y-128 { row-gap: var(--space-128); }