Generated by SassMeister.com.

input.scss

@function dash-join($args...) {
	$result: null;
	$first-add: true;
	$glue: '-';

	@for $i from 1 through length($args) {
		$e: nth($args, $i);

		@if $e != null and $e != '' {
			$result: if($i == 1 or $first-add == true, #{$e}, #{$result}#{$glue}#{$e});
			$first-add: false;
		}
	}

	@return $result;
}

@function pixel-to-rem($value) {
	@return if(type-of($value) == 'number' and unitless($value), rem($value), $value);
}

$sizings: ('0': 0, '0\\\.5': 2, '1': 4, '2': 8, '3': 12, '4': 16, '5': 20, '6': 24, '7': 28, '8': 32, '10': 40, '11': 44, '12': 48, '14': 56, 'full': 100%, 'auto': 'auto');
$directions: (w: inline, h: block);
$boudaries: (min, '' , max);
$queries: (
	default: 'all',
	sm: '>xsmall',
	md: '>small',
	lg: '>medium',
	xl: '>large',
);

@each $breakpointname, $query in $queries {
	@media($query) {
		@each $direction, $property in $directions {
			@each $boundary in $boudaries {
				$propname: dash-join($boundary, $property, 'size');
				@each $sizingname, $size in $sizings {
					$classname: #{if($breakpointname == 'default', '', $breakpointname + '\\\:')}#{dash-join($boundary, $direction, $sizingname)};

					.#{$classname} {
						#{$propname}: #{pixel-to-rem($size)};
					}
				}

				$classname: #{if($breakpointname == 'default', '', $breakpointname + '\\\:')}#{dash-join($boundary, $direction, 'custom')};
				$value: #{if($breakpointname == 'default', '', $breakpointname + '-')}#{dash-join($boundary, $direction, 'custom')};

				.#{$classname} {
					&#{&} { // Specificity fail 😒
						#{$propname}: var(--#{$value});
					}
				}
			}
		}
	}
}

output.css

@media (all) {
  .min-w-0 {
    min-inline-size: rem(0);
  }

  .min-w-0\.5 {
    min-inline-size: rem(2);
  }

  .min-w-1 {
    min-inline-size: rem(4);
  }

  .min-w-2 {
    min-inline-size: rem(8);
  }

  .min-w-3 {
    min-inline-size: rem(12);
  }

  .min-w-4 {
    min-inline-size: rem(16);
  }

  .min-w-5 {
    min-inline-size: rem(20);
  }

  .min-w-6 {
    min-inline-size: rem(24);
  }

  .min-w-7 {
    min-inline-size: rem(28);
  }

  .min-w-8 {
    min-inline-size: rem(32);
  }

  .min-w-10 {
    min-inline-size: rem(40);
  }

  .min-w-11 {
    min-inline-size: rem(44);
  }

  .min-w-12 {
    min-inline-size: rem(48);
  }

  .min-w-14 {
    min-inline-size: rem(56);
  }

  .min-w-full {
    min-inline-size: 100%;
  }

  .min-w-auto {
    min-inline-size: auto;
  }

  .min-w-custom.min-w-custom {
    min-inline-size: var(--min-w-custom);
  }

  .w-0 {
    inline-size: rem(0);
  }

  .w-0\.5 {
    inline-size: rem(2);
  }

  .w-1 {
    inline-size: rem(4);
  }

  .w-2 {
    inline-size: rem(8);
  }

  .w-3 {
    inline-size: rem(12);
  }

  .w-4 {
    inline-size: rem(16);
  }

  .w-5 {
    inline-size: rem(20);
  }

  .w-6 {
    inline-size: rem(24);
  }

  .w-7 {
    inline-size: rem(28);
  }

  .w-8 {
    inline-size: rem(32);
  }

  .w-10 {
    inline-size: rem(40);
  }

  .w-11 {
    inline-size: rem(44);
  }

  .w-12 {
    inline-size: rem(48);
  }

  .w-14 {
    inline-size: rem(56);
  }

  .w-full {
    inline-size: 100%;
  }

  .w-auto {
    inline-size: auto;
  }

  .w-custom.w-custom {
    inline-size: var(--w-custom);
  }

  .max-w-0 {
    max-inline-size: rem(0);
  }

  .max-w-0\.5 {
    max-inline-size: rem(2);
  }

  .max-w-1 {
    max-inline-size: rem(4);
  }

  .max-w-2 {
    max-inline-size: rem(8);
  }

  .max-w-3 {
    max-inline-size: rem(12);
  }

  .max-w-4 {
    max-inline-size: rem(16);
  }

  .max-w-5 {
    max-inline-size: rem(20);
  }

  .max-w-6 {
    max-inline-size: rem(24);
  }

  .max-w-7 {
    max-inline-size: rem(28);
  }

  .max-w-8 {
    max-inline-size: rem(32);
  }

  .max-w-10 {
    max-inline-size: rem(40);
  }

  .max-w-11 {
    max-inline-size: rem(44);
  }

  .max-w-12 {
    max-inline-size: rem(48);
  }

  .max-w-14 {
    max-inline-size: rem(56);
  }

  .max-w-full {
    max-inline-size: 100%;
  }

  .max-w-auto {
    max-inline-size: auto;
  }

  .max-w-custom.max-w-custom {
    max-inline-size: var(--max-w-custom);
  }

  .min-h-0 {
    min-block-size: rem(0);
  }

  .min-h-0\.5 {
    min-block-size: rem(2);
  }

  .min-h-1 {
    min-block-size: rem(4);
  }

  .min-h-2 {
    min-block-size: rem(8);
  }

  .min-h-3 {
    min-block-size: rem(12);
  }

  .min-h-4 {
    min-block-size: rem(16);
  }

  .min-h-5 {
    min-block-size: rem(20);
  }

  .min-h-6 {
    min-block-size: rem(24);
  }

  .min-h-7 {
    min-block-size: rem(28);
  }

  .min-h-8 {
    min-block-size: rem(32);
  }

  .min-h-10 {
    min-block-size: rem(40);
  }

  .min-h-11 {
    min-block-size: rem(44);
  }

  .min-h-12 {
    min-block-size: rem(48);
  }

  .min-h-14 {
    min-block-size: rem(56);
  }

  .min-h-full {
    min-block-size: 100%;
  }

  .min-h-auto {
    min-block-size: auto;
  }

  .min-h-custom.min-h-custom {
    min-block-size: var(--min-h-custom);
  }

  .h-0 {
    block-size: rem(0);
  }

  .h-0\.5 {
    block-size: rem(2);
  }

  .h-1 {
    block-size: rem(4);
  }

  .h-2 {
    block-size: rem(8);
  }

  .h-3 {
    block-size: rem(12);
  }

  .h-4 {
    block-size: rem(16);
  }

  .h-5 {
    block-size: rem(20);
  }

  .h-6 {
    block-size: rem(24);
  }

  .h-7 {
    block-size: rem(28);
  }

  .h-8 {
    block-size: rem(32);
  }

  .h-10 {
    block-size: rem(40);
  }

  .h-11 {
    block-size: rem(44);
  }

  .h-12 {
    block-size: rem(48);
  }

  .h-14 {
    block-size: rem(56);
  }

  .h-full {
    block-size: 100%;
  }

  .h-auto {
    block-size: auto;
  }

  .h-custom.h-custom {
    block-size: var(--h-custom);
  }

  .max-h-0 {
    max-block-size: rem(0);
  }

  .max-h-0\.5 {
    max-block-size: rem(2);
  }

  .max-h-1 {
    max-block-size: rem(4);
  }

  .max-h-2 {
    max-block-size: rem(8);
  }

  .max-h-3 {
    max-block-size: rem(12);
  }

  .max-h-4 {
    max-block-size: rem(16);
  }

  .max-h-5 {
    max-block-size: rem(20);
  }

  .max-h-6 {
    max-block-size: rem(24);
  }

  .max-h-7 {
    max-block-size: rem(28);
  }

  .max-h-8 {
    max-block-size: rem(32);
  }

  .max-h-10 {
    max-block-size: rem(40);
  }

  .max-h-11 {
    max-block-size: rem(44);
  }

  .max-h-12 {
    max-block-size: rem(48);
  }

  .max-h-14 {
    max-block-size: rem(56);
  }

  .max-h-full {
    max-block-size: 100%;
  }

  .max-h-auto {
    max-block-size: auto;
  }

  .max-h-custom.max-h-custom {
    max-block-size: var(--max-h-custom);
  }
}
@media (>xsmall) {
  .sm\:min-w-0 {
    min-inline-size: rem(0);
  }

  .sm\:min-w-0\.5 {
    min-inline-size: rem(2);
  }

  .sm\:min-w-1 {
    min-inline-size: rem(4);
  }

  .sm\:min-w-2 {
    min-inline-size: rem(8);
  }

  .sm\:min-w-3 {
    min-inline-size: rem(12);
  }

  .sm\:min-w-4 {
    min-inline-size: rem(16);
  }

  .sm\:min-w-5 {
    min-inline-size: rem(20);
  }

  .sm\:min-w-6 {
    min-inline-size: rem(24);
  }

  .sm\:min-w-7 {
    min-inline-size: rem(28);
  }

  .sm\:min-w-8 {
    min-inline-size: rem(32);
  }

  .sm\:min-w-10 {
    min-inline-size: rem(40);
  }

  .sm\:min-w-11 {
    min-inline-size: rem(44);
  }

  .sm\:min-w-12 {
    min-inline-size: rem(48);
  }

  .sm\:min-w-14 {
    min-inline-size: rem(56);
  }

  .sm\:min-w-full {
    min-inline-size: 100%;
  }

  .sm\:min-w-auto {
    min-inline-size: auto;
  }

  .sm\:min-w-custom.sm\:min-w-custom {
    min-inline-size: var(--sm-min-w-custom);
  }

  .sm\:w-0 {
    inline-size: rem(0);
  }

  .sm\:w-0\.5 {
    inline-size: rem(2);
  }

  .sm\:w-1 {
    inline-size: rem(4);
  }

  .sm\:w-2 {
    inline-size: rem(8);
  }

  .sm\:w-3 {
    inline-size: rem(12);
  }

  .sm\:w-4 {
    inline-size: rem(16);
  }

  .sm\:w-5 {
    inline-size: rem(20);
  }

  .sm\:w-6 {
    inline-size: rem(24);
  }

  .sm\:w-7 {
    inline-size: rem(28);
  }

  .sm\:w-8 {
    inline-size: rem(32);
  }

  .sm\:w-10 {
    inline-size: rem(40);
  }

  .sm\:w-11 {
    inline-size: rem(44);
  }

  .sm\:w-12 {
    inline-size: rem(48);
  }

  .sm\:w-14 {
    inline-size: rem(56);
  }

  .sm\:w-full {
    inline-size: 100%;
  }

  .sm\:w-auto {
    inline-size: auto;
  }

  .sm\:w-custom.sm\:w-custom {
    inline-size: var(--sm-w-custom);
  }

  .sm\:max-w-0 {
    max-inline-size: rem(0);
  }

  .sm\:max-w-0\.5 {
    max-inline-size: rem(2);
  }

  .sm\:max-w-1 {
    max-inline-size: rem(4);
  }

  .sm\:max-w-2 {
    max-inline-size: rem(8);
  }

  .sm\:max-w-3 {
    max-inline-size: rem(12);
  }

  .sm\:max-w-4 {
    max-inline-size: rem(16);
  }

  .sm\:max-w-5 {
    max-inline-size: rem(20);
  }

  .sm\:max-w-6 {
    max-inline-size: rem(24);
  }

  .sm\:max-w-7 {
    max-inline-size: rem(28);
  }

  .sm\:max-w-8 {
    max-inline-size: rem(32);
  }

  .sm\:max-w-10 {
    max-inline-size: rem(40);
  }

  .sm\:max-w-11 {
    max-inline-size: rem(44);
  }

  .sm\:max-w-12 {
    max-inline-size: rem(48);
  }

  .sm\:max-w-14 {
    max-inline-size: rem(56);
  }

  .sm\:max-w-full {
    max-inline-size: 100%;
  }

  .sm\:max-w-auto {
    max-inline-size: auto;
  }

  .sm\:max-w-custom.sm\:max-w-custom {
    max-inline-size: var(--sm-max-w-custom);
  }

  .sm\:min-h-0 {
    min-block-size: rem(0);
  }

  .sm\:min-h-0\.5 {
    min-block-size: rem(2);
  }

  .sm\:min-h-1 {
    min-block-size: rem(4);
  }

  .sm\:min-h-2 {
    min-block-size: rem(8);
  }

  .sm\:min-h-3 {
    min-block-size: rem(12);
  }

  .sm\:min-h-4 {
    min-block-size: rem(16);
  }

  .sm\:min-h-5 {
    min-block-size: rem(20);
  }

  .sm\:min-h-6 {
    min-block-size: rem(24);
  }

  .sm\:min-h-7 {
    min-block-size: rem(28);
  }

  .sm\:min-h-8 {
    min-block-size: rem(32);
  }

  .sm\:min-h-10 {
    min-block-size: rem(40);
  }

  .sm\:min-h-11 {
    min-block-size: rem(44);
  }

  .sm\:min-h-12 {
    min-block-size: rem(48);
  }

  .sm\:min-h-14 {
    min-block-size: rem(56);
  }

  .sm\:min-h-full {
    min-block-size: 100%;
  }

  .sm\:min-h-auto {
    min-block-size: auto;
  }

  .sm\:min-h-custom.sm\:min-h-custom {
    min-block-size: var(--sm-min-h-custom);
  }

  .sm\:h-0 {
    block-size: rem(0);
  }

  .sm\:h-0\.5 {
    block-size: rem(2);
  }

  .sm\:h-1 {
    block-size: rem(4);
  }

  .sm\:h-2 {
    block-size: rem(8);
  }

  .sm\:h-3 {
    block-size: rem(12);
  }

  .sm\:h-4 {
    block-size: rem(16);
  }

  .sm\:h-5 {
    block-size: rem(20);
  }

  .sm\:h-6 {
    block-size: rem(24);
  }

  .sm\:h-7 {
    block-size: rem(28);
  }

  .sm\:h-8 {
    block-size: rem(32);
  }

  .sm\:h-10 {
    block-size: rem(40);
  }

  .sm\:h-11 {
    block-size: rem(44);
  }

  .sm\:h-12 {
    block-size: rem(48);
  }

  .sm\:h-14 {
    block-size: rem(56);
  }

  .sm\:h-full {
    block-size: 100%;
  }

  .sm\:h-auto {
    block-size: auto;
  }

  .sm\:h-custom.sm\:h-custom {
    block-size: var(--sm-h-custom);
  }

  .sm\:max-h-0 {
    max-block-size: rem(0);
  }

  .sm\:max-h-0\.5 {
    max-block-size: rem(2);
  }

  .sm\:max-h-1 {
    max-block-size: rem(4);
  }

  .sm\:max-h-2 {
    max-block-size: rem(8);
  }

  .sm\:max-h-3 {
    max-block-size: rem(12);
  }

  .sm\:max-h-4 {
    max-block-size: rem(16);
  }

  .sm\:max-h-5 {
    max-block-size: rem(20);
  }

  .sm\:max-h-6 {
    max-block-size: rem(24);
  }

  .sm\:max-h-7 {
    max-block-size: rem(28);
  }

  .sm\:max-h-8 {
    max-block-size: rem(32);
  }

  .sm\:max-h-10 {
    max-block-size: rem(40);
  }

  .sm\:max-h-11 {
    max-block-size: rem(44);
  }

  .sm\:max-h-12 {
    max-block-size: rem(48);
  }

  .sm\:max-h-14 {
    max-block-size: rem(56);
  }

  .sm\:max-h-full {
    max-block-size: 100%;
  }

  .sm\:max-h-auto {
    max-block-size: auto;
  }

  .sm\:max-h-custom.sm\:max-h-custom {
    max-block-size: var(--sm-max-h-custom);
  }
}
@media (>small) {
  .md\:min-w-0 {
    min-inline-size: rem(0);
  }

  .md\:min-w-0\.5 {
    min-inline-size: rem(2);
  }

  .md\:min-w-1 {
    min-inline-size: rem(4);
  }

  .md\:min-w-2 {
    min-inline-size: rem(8);
  }

  .md\:min-w-3 {
    min-inline-size: rem(12);
  }

  .md\:min-w-4 {
    min-inline-size: rem(16);
  }

  .md\:min-w-5 {
    min-inline-size: rem(20);
  }

  .md\:min-w-6 {
    min-inline-size: rem(24);
  }

  .md\:min-w-7 {
    min-inline-size: rem(28);
  }

  .md\:min-w-8 {
    min-inline-size: rem(32);
  }

  .md\:min-w-10 {
    min-inline-size: rem(40);
  }

  .md\:min-w-11 {
    min-inline-size: rem(44);
  }

  .md\:min-w-12 {
    min-inline-size: rem(48);
  }

  .md\:min-w-14 {
    min-inline-size: rem(56);
  }

  .md\:min-w-full {
    min-inline-size: 100%;
  }

  .md\:min-w-auto {
    min-inline-size: auto;
  }

  .md\:min-w-custom.md\:min-w-custom {
    min-inline-size: var(--md-min-w-custom);
  }

  .md\:w-0 {
    inline-size: rem(0);
  }

  .md\:w-0\.5 {
    inline-size: rem(2);
  }

  .md\:w-1 {
    inline-size: rem(4);
  }

  .md\:w-2 {
    inline-size: rem(8);
  }

  .md\:w-3 {
    inline-size: rem(12);
  }

  .md\:w-4 {
    inline-size: rem(16);
  }

  .md\:w-5 {
    inline-size: rem(20);
  }

  .md\:w-6 {
    inline-size: rem(24);
  }

  .md\:w-7 {
    inline-size: rem(28);
  }

  .md\:w-8 {
    inline-size: rem(32);
  }

  .md\:w-10 {
    inline-size: rem(40);
  }

  .md\:w-11 {
    inline-size: rem(44);
  }

  .md\:w-12 {
    inline-size: rem(48);
  }

  .md\:w-14 {
    inline-size: rem(56);
  }

  .md\:w-full {
    inline-size: 100%;
  }

  .md\:w-auto {
    inline-size: auto;
  }

  .md\:w-custom.md\:w-custom {
    inline-size: var(--md-w-custom);
  }

  .md\:max-w-0 {
    max-inline-size: rem(0);
  }

  .md\:max-w-0\.5 {
    max-inline-size: rem(2);
  }

  .md\:max-w-1 {
    max-inline-size: rem(4);
  }

  .md\:max-w-2 {
    max-inline-size: rem(8);
  }

  .md\:max-w-3 {
    max-inline-size: rem(12);
  }

  .md\:max-w-4 {
    max-inline-size: rem(16);
  }

  .md\:max-w-5 {
    max-inline-size: rem(20);
  }

  .md\:max-w-6 {
    max-inline-size: rem(24);
  }

  .md\:max-w-7 {
    max-inline-size: rem(28);
  }

  .md\:max-w-8 {
    max-inline-size: rem(32);
  }

  .md\:max-w-10 {
    max-inline-size: rem(40);
  }

  .md\:max-w-11 {
    max-inline-size: rem(44);
  }

  .md\:max-w-12 {
    max-inline-size: rem(48);
  }

  .md\:max-w-14 {
    max-inline-size: rem(56);
  }

  .md\:max-w-full {
    max-inline-size: 100%;
  }

  .md\:max-w-auto {
    max-inline-size: auto;
  }

  .md\:max-w-custom.md\:max-w-custom {
    max-inline-size: var(--md-max-w-custom);
  }

  .md\:min-h-0 {
    min-block-size: rem(0);
  }

  .md\:min-h-0\.5 {
    min-block-size: rem(2);
  }

  .md\:min-h-1 {
    min-block-size: rem(4);
  }

  .md\:min-h-2 {
    min-block-size: rem(8);
  }

  .md\:min-h-3 {
    min-block-size: rem(12);
  }

  .md\:min-h-4 {
    min-block-size: rem(16);
  }

  .md\:min-h-5 {
    min-block-size: rem(20);
  }

  .md\:min-h-6 {
    min-block-size: rem(24);
  }

  .md\:min-h-7 {
    min-block-size: rem(28);
  }

  .md\:min-h-8 {
    min-block-size: rem(32);
  }

  .md\:min-h-10 {
    min-block-size: rem(40);
  }

  .md\:min-h-11 {
    min-block-size: rem(44);
  }

  .md\:min-h-12 {
    min-block-size: rem(48);
  }

  .md\:min-h-14 {
    min-block-size: rem(56);
  }

  .md\:min-h-full {
    min-block-size: 100%;
  }

  .md\:min-h-auto {
    min-block-size: auto;
  }

  .md\:min-h-custom.md\:min-h-custom {
    min-block-size: var(--md-min-h-custom);
  }

  .md\:h-0 {
    block-size: rem(0);
  }

  .md\:h-0\.5 {
    block-size: rem(2);
  }

  .md\:h-1 {
    block-size: rem(4);
  }

  .md\:h-2 {
    block-size: rem(8);
  }

  .md\:h-3 {
    block-size: rem(12);
  }

  .md\:h-4 {
    block-size: rem(16);
  }

  .md\:h-5 {
    block-size: rem(20);
  }

  .md\:h-6 {
    block-size: rem(24);
  }

  .md\:h-7 {
    block-size: rem(28);
  }

  .md\:h-8 {
    block-size: rem(32);
  }

  .md\:h-10 {
    block-size: rem(40);
  }

  .md\:h-11 {
    block-size: rem(44);
  }

  .md\:h-12 {
    block-size: rem(48);
  }

  .md\:h-14 {
    block-size: rem(56);
  }

  .md\:h-full {
    block-size: 100%;
  }

  .md\:h-auto {
    block-size: auto;
  }

  .md\:h-custom.md\:h-custom {
    block-size: var(--md-h-custom);
  }

  .md\:max-h-0 {
    max-block-size: rem(0);
  }

  .md\:max-h-0\.5 {
    max-block-size: rem(2);
  }

  .md\:max-h-1 {
    max-block-size: rem(4);
  }

  .md\:max-h-2 {
    max-block-size: rem(8);
  }

  .md\:max-h-3 {
    max-block-size: rem(12);
  }

  .md\:max-h-4 {
    max-block-size: rem(16);
  }

  .md\:max-h-5 {
    max-block-size: rem(20);
  }

  .md\:max-h-6 {
    max-block-size: rem(24);
  }

  .md\:max-h-7 {
    max-block-size: rem(28);
  }

  .md\:max-h-8 {
    max-block-size: rem(32);
  }

  .md\:max-h-10 {
    max-block-size: rem(40);
  }

  .md\:max-h-11 {
    max-block-size: rem(44);
  }

  .md\:max-h-12 {
    max-block-size: rem(48);
  }

  .md\:max-h-14 {
    max-block-size: rem(56);
  }

  .md\:max-h-full {
    max-block-size: 100%;
  }

  .md\:max-h-auto {
    max-block-size: auto;
  }

  .md\:max-h-custom.md\:max-h-custom {
    max-block-size: var(--md-max-h-custom);
  }
}
@media (>medium) {
  .lg\:min-w-0 {
    min-inline-size: rem(0);
  }

  .lg\:min-w-0\.5 {
    min-inline-size: rem(2);
  }

  .lg\:min-w-1 {
    min-inline-size: rem(4);
  }

  .lg\:min-w-2 {
    min-inline-size: rem(8);
  }

  .lg\:min-w-3 {
    min-inline-size: rem(12);
  }

  .lg\:min-w-4 {
    min-inline-size: rem(16);
  }

  .lg\:min-w-5 {
    min-inline-size: rem(20);
  }

  .lg\:min-w-6 {
    min-inline-size: rem(24);
  }

  .lg\:min-w-7 {
    min-inline-size: rem(28);
  }

  .lg\:min-w-8 {
    min-inline-size: rem(32);
  }

  .lg\:min-w-10 {
    min-inline-size: rem(40);
  }

  .lg\:min-w-11 {
    min-inline-size: rem(44);
  }

  .lg\:min-w-12 {
    min-inline-size: rem(48);
  }

  .lg\:min-w-14 {
    min-inline-size: rem(56);
  }

  .lg\:min-w-full {
    min-inline-size: 100%;
  }

  .lg\:min-w-auto {
    min-inline-size: auto;
  }

  .lg\:min-w-custom.lg\:min-w-custom {
    min-inline-size: var(--lg-min-w-custom);
  }

  .lg\:w-0 {
    inline-size: rem(0);
  }

  .lg\:w-0\.5 {
    inline-size: rem(2);
  }

  .lg\:w-1 {
    inline-size: rem(4);
  }

  .lg\:w-2 {
    inline-size: rem(8);
  }

  .lg\:w-3 {
    inline-size: rem(12);
  }

  .lg\:w-4 {
    inline-size: rem(16);
  }

  .lg\:w-5 {
    inline-size: rem(20);
  }

  .lg\:w-6 {
    inline-size: rem(24);
  }

  .lg\:w-7 {
    inline-size: rem(28);
  }

  .lg\:w-8 {
    inline-size: rem(32);
  }

  .lg\:w-10 {
    inline-size: rem(40);
  }

  .lg\:w-11 {
    inline-size: rem(44);
  }

  .lg\:w-12 {
    inline-size: rem(48);
  }

  .lg\:w-14 {
    inline-size: rem(56);
  }

  .lg\:w-full {
    inline-size: 100%;
  }

  .lg\:w-auto {
    inline-size: auto;
  }

  .lg\:w-custom.lg\:w-custom {
    inline-size: var(--lg-w-custom);
  }

  .lg\:max-w-0 {
    max-inline-size: rem(0);
  }

  .lg\:max-w-0\.5 {
    max-inline-size: rem(2);
  }

  .lg\:max-w-1 {
    max-inline-size: rem(4);
  }

  .lg\:max-w-2 {
    max-inline-size: rem(8);
  }

  .lg\:max-w-3 {
    max-inline-size: rem(12);
  }

  .lg\:max-w-4 {
    max-inline-size: rem(16);
  }

  .lg\:max-w-5 {
    max-inline-size: rem(20);
  }

  .lg\:max-w-6 {
    max-inline-size: rem(24);
  }

  .lg\:max-w-7 {
    max-inline-size: rem(28);
  }

  .lg\:max-w-8 {
    max-inline-size: rem(32);
  }

  .lg\:max-w-10 {
    max-inline-size: rem(40);
  }

  .lg\:max-w-11 {
    max-inline-size: rem(44);
  }

  .lg\:max-w-12 {
    max-inline-size: rem(48);
  }

  .lg\:max-w-14 {
    max-inline-size: rem(56);
  }

  .lg\:max-w-full {
    max-inline-size: 100%;
  }

  .lg\:max-w-auto {
    max-inline-size: auto;
  }

  .lg\:max-w-custom.lg\:max-w-custom {
    max-inline-size: var(--lg-max-w-custom);
  }

  .lg\:min-h-0 {
    min-block-size: rem(0);
  }

  .lg\:min-h-0\.5 {
    min-block-size: rem(2);
  }

  .lg\:min-h-1 {
    min-block-size: rem(4);
  }

  .lg\:min-h-2 {
    min-block-size: rem(8);
  }

  .lg\:min-h-3 {
    min-block-size: rem(12);
  }

  .lg\:min-h-4 {
    min-block-size: rem(16);
  }

  .lg\:min-h-5 {
    min-block-size: rem(20);
  }

  .lg\:min-h-6 {
    min-block-size: rem(24);
  }

  .lg\:min-h-7 {
    min-block-size: rem(28);
  }

  .lg\:min-h-8 {
    min-block-size: rem(32);
  }

  .lg\:min-h-10 {
    min-block-size: rem(40);
  }

  .lg\:min-h-11 {
    min-block-size: rem(44);
  }

  .lg\:min-h-12 {
    min-block-size: rem(48);
  }

  .lg\:min-h-14 {
    min-block-size: rem(56);
  }

  .lg\:min-h-full {
    min-block-size: 100%;
  }

  .lg\:min-h-auto {
    min-block-size: auto;
  }

  .lg\:min-h-custom.lg\:min-h-custom {
    min-block-size: var(--lg-min-h-custom);
  }

  .lg\:h-0 {
    block-size: rem(0);
  }

  .lg\:h-0\.5 {
    block-size: rem(2);
  }

  .lg\:h-1 {
    block-size: rem(4);
  }

  .lg\:h-2 {
    block-size: rem(8);
  }

  .lg\:h-3 {
    block-size: rem(12);
  }

  .lg\:h-4 {
    block-size: rem(16);
  }

  .lg\:h-5 {
    block-size: rem(20);
  }

  .lg\:h-6 {
    block-size: rem(24);
  }

  .lg\:h-7 {
    block-size: rem(28);
  }

  .lg\:h-8 {
    block-size: rem(32);
  }

  .lg\:h-10 {
    block-size: rem(40);
  }

  .lg\:h-11 {
    block-size: rem(44);
  }

  .lg\:h-12 {
    block-size: rem(48);
  }

  .lg\:h-14 {
    block-size: rem(56);
  }

  .lg\:h-full {
    block-size: 100%;
  }

  .lg\:h-auto {
    block-size: auto;
  }

  .lg\:h-custom.lg\:h-custom {
    block-size: var(--lg-h-custom);
  }

  .lg\:max-h-0 {
    max-block-size: rem(0);
  }

  .lg\:max-h-0\.5 {
    max-block-size: rem(2);
  }

  .lg\:max-h-1 {
    max-block-size: rem(4);
  }

  .lg\:max-h-2 {
    max-block-size: rem(8);
  }

  .lg\:max-h-3 {
    max-block-size: rem(12);
  }

  .lg\:max-h-4 {
    max-block-size: rem(16);
  }

  .lg\:max-h-5 {
    max-block-size: rem(20);
  }

  .lg\:max-h-6 {
    max-block-size: rem(24);
  }

  .lg\:max-h-7 {
    max-block-size: rem(28);
  }

  .lg\:max-h-8 {
    max-block-size: rem(32);
  }

  .lg\:max-h-10 {
    max-block-size: rem(40);
  }

  .lg\:max-h-11 {
    max-block-size: rem(44);
  }

  .lg\:max-h-12 {
    max-block-size: rem(48);
  }

  .lg\:max-h-14 {
    max-block-size: rem(56);
  }

  .lg\:max-h-full {
    max-block-size: 100%;
  }

  .lg\:max-h-auto {
    max-block-size: auto;
  }

  .lg\:max-h-custom.lg\:max-h-custom {
    max-block-size: var(--lg-max-h-custom);
  }
}
@media (>large) {
  .xl\:min-w-0 {
    min-inline-size: rem(0);
  }

  .xl\:min-w-0\.5 {
    min-inline-size: rem(2);
  }

  .xl\:min-w-1 {
    min-inline-size: rem(4);
  }

  .xl\:min-w-2 {
    min-inline-size: rem(8);
  }

  .xl\:min-w-3 {
    min-inline-size: rem(12);
  }

  .xl\:min-w-4 {
    min-inline-size: rem(16);
  }

  .xl\:min-w-5 {
    min-inline-size: rem(20);
  }

  .xl\:min-w-6 {
    min-inline-size: rem(24);
  }

  .xl\:min-w-7 {
    min-inline-size: rem(28);
  }

  .xl\:min-w-8 {
    min-inline-size: rem(32);
  }

  .xl\:min-w-10 {
    min-inline-size: rem(40);
  }

  .xl\:min-w-11 {
    min-inline-size: rem(44);
  }

  .xl\:min-w-12 {
    min-inline-size: rem(48);
  }

  .xl\:min-w-14 {
    min-inline-size: rem(56);
  }

  .xl\:min-w-full {
    min-inline-size: 100%;
  }

  .xl\:min-w-auto {
    min-inline-size: auto;
  }

  .xl\:min-w-custom.xl\:min-w-custom {
    min-inline-size: var(--xl-min-w-custom);
  }

  .xl\:w-0 {
    inline-size: rem(0);
  }

  .xl\:w-0\.5 {
    inline-size: rem(2);
  }

  .xl\:w-1 {
    inline-size: rem(4);
  }

  .xl\:w-2 {
    inline-size: rem(8);
  }

  .xl\:w-3 {
    inline-size: rem(12);
  }

  .xl\:w-4 {
    inline-size: rem(16);
  }

  .xl\:w-5 {
    inline-size: rem(20);
  }

  .xl\:w-6 {
    inline-size: rem(24);
  }

  .xl\:w-7 {
    inline-size: rem(28);
  }

  .xl\:w-8 {
    inline-size: rem(32);
  }

  .xl\:w-10 {
    inline-size: rem(40);
  }

  .xl\:w-11 {
    inline-size: rem(44);
  }

  .xl\:w-12 {
    inline-size: rem(48);
  }

  .xl\:w-14 {
    inline-size: rem(56);
  }

  .xl\:w-full {
    inline-size: 100%;
  }

  .xl\:w-auto {
    inline-size: auto;
  }

  .xl\:w-custom.xl\:w-custom {
    inline-size: var(--xl-w-custom);
  }

  .xl\:max-w-0 {
    max-inline-size: rem(0);
  }

  .xl\:max-w-0\.5 {
    max-inline-size: rem(2);
  }

  .xl\:max-w-1 {
    max-inline-size: rem(4);
  }

  .xl\:max-w-2 {
    max-inline-size: rem(8);
  }

  .xl\:max-w-3 {
    max-inline-size: rem(12);
  }

  .xl\:max-w-4 {
    max-inline-size: rem(16);
  }

  .xl\:max-w-5 {
    max-inline-size: rem(20);
  }

  .xl\:max-w-6 {
    max-inline-size: rem(24);
  }

  .xl\:max-w-7 {
    max-inline-size: rem(28);
  }

  .xl\:max-w-8 {
    max-inline-size: rem(32);
  }

  .xl\:max-w-10 {
    max-inline-size: rem(40);
  }

  .xl\:max-w-11 {
    max-inline-size: rem(44);
  }

  .xl\:max-w-12 {
    max-inline-size: rem(48);
  }

  .xl\:max-w-14 {
    max-inline-size: rem(56);
  }

  .xl\:max-w-full {
    max-inline-size: 100%;
  }

  .xl\:max-w-auto {
    max-inline-size: auto;
  }

  .xl\:max-w-custom.xl\:max-w-custom {
    max-inline-size: var(--xl-max-w-custom);
  }

  .xl\:min-h-0 {
    min-block-size: rem(0);
  }

  .xl\:min-h-0\.5 {
    min-block-size: rem(2);
  }

  .xl\:min-h-1 {
    min-block-size: rem(4);
  }

  .xl\:min-h-2 {
    min-block-size: rem(8);
  }

  .xl\:min-h-3 {
    min-block-size: rem(12);
  }

  .xl\:min-h-4 {
    min-block-size: rem(16);
  }

  .xl\:min-h-5 {
    min-block-size: rem(20);
  }

  .xl\:min-h-6 {
    min-block-size: rem(24);
  }

  .xl\:min-h-7 {
    min-block-size: rem(28);
  }

  .xl\:min-h-8 {
    min-block-size: rem(32);
  }

  .xl\:min-h-10 {
    min-block-size: rem(40);
  }

  .xl\:min-h-11 {
    min-block-size: rem(44);
  }

  .xl\:min-h-12 {
    min-block-size: rem(48);
  }

  .xl\:min-h-14 {
    min-block-size: rem(56);
  }

  .xl\:min-h-full {
    min-block-size: 100%;
  }

  .xl\:min-h-auto {
    min-block-size: auto;
  }

  .xl\:min-h-custom.xl\:min-h-custom {
    min-block-size: var(--xl-min-h-custom);
  }

  .xl\:h-0 {
    block-size: rem(0);
  }

  .xl\:h-0\.5 {
    block-size: rem(2);
  }

  .xl\:h-1 {
    block-size: rem(4);
  }

  .xl\:h-2 {
    block-size: rem(8);
  }

  .xl\:h-3 {
    block-size: rem(12);
  }

  .xl\:h-4 {
    block-size: rem(16);
  }

  .xl\:h-5 {
    block-size: rem(20);
  }

  .xl\:h-6 {
    block-size: rem(24);
  }

  .xl\:h-7 {
    block-size: rem(28);
  }

  .xl\:h-8 {
    block-size: rem(32);
  }

  .xl\:h-10 {
    block-size: rem(40);
  }

  .xl\:h-11 {
    block-size: rem(44);
  }

  .xl\:h-12 {
    block-size: rem(48);
  }

  .xl\:h-14 {
    block-size: rem(56);
  }

  .xl\:h-full {
    block-size: 100%;
  }

  .xl\:h-auto {
    block-size: auto;
  }

  .xl\:h-custom.xl\:h-custom {
    block-size: var(--xl-h-custom);
  }

  .xl\:max-h-0 {
    max-block-size: rem(0);
  }

  .xl\:max-h-0\.5 {
    max-block-size: rem(2);
  }

  .xl\:max-h-1 {
    max-block-size: rem(4);
  }

  .xl\:max-h-2 {
    max-block-size: rem(8);
  }

  .xl\:max-h-3 {
    max-block-size: rem(12);
  }

  .xl\:max-h-4 {
    max-block-size: rem(16);
  }

  .xl\:max-h-5 {
    max-block-size: rem(20);
  }

  .xl\:max-h-6 {
    max-block-size: rem(24);
  }

  .xl\:max-h-7 {
    max-block-size: rem(28);
  }

  .xl\:max-h-8 {
    max-block-size: rem(32);
  }

  .xl\:max-h-10 {
    max-block-size: rem(40);
  }

  .xl\:max-h-11 {
    max-block-size: rem(44);
  }

  .xl\:max-h-12 {
    max-block-size: rem(48);
  }

  .xl\:max-h-14 {
    max-block-size: rem(56);
  }

  .xl\:max-h-full {
    max-block-size: 100%;
  }

  .xl\:max-h-auto {
    max-block-size: auto;
  }

  .xl\:max-h-custom.xl\:max-h-custom {
    max-block-size: var(--xl-max-h-custom);
  }
}

settings.json

{
  "sass": {
    "compiler": "dart-sass/1.32.12",
    "extensions": {},
    "syntax": "SCSS",
    "outputStyle": "expanded"
  },
  "autoprefixer": false
}