Generated by SassMeister.com.

input.scss

@function negative-map($map) {
  $result: ();
  @each $key, $value in $map {
    @if $value != 0 {
      $result: map-merge($result, ("-" + $key: (-$value)));
    }
  }
  @return $result;
}

$hover-overlay: 5%;
$focus-overlay: 10%;
$selected-overlay: 10%;
$activated-overlay: 10%;
$pressed-overlay: 15%;
$dragged-overlay: 15%;

$screens: (
  sm: "640px",
  md: "768px",
  lg: "1024px",
  xl: "1280px",
  xxl: "1536px",
);
$containers: (
  "": 0,
  sm: 576px,
  md: 768px,
  lg: 992px,
  xl: 1200px,
  xxl: 1400px,
);
$columns: 12;
$row-columns: 6;
$gutters: (
  0: 0,
  1: 0.25rem,
  2: 0.5rem,
  3: 1rem,
  4: 1.5rem,
  5: 3rem,
);

//Colors
$colors: (
  red-50: #ffebee,
  red-100: #ffcdd2,
  red-200: #ef9a9a,
  red-300: #e57373,
  red-400: #ef5350,
  red-500: #f44336,
  red-600: #e53935,
  red-700: #d32f2f,
  red-800: #c62828,
  red-900: #b71c1c,
  red-A100: #ff8a80,
  red-A200: #ff5252,
  red-A400: #ff1744,
  red-A700: #d50000,
  pink-50: #fce4ec,
  pink-100: #f8bbd0,
  pink-200: #f48fb1,
  pink-300: #f06292,
  pink-400: #ec407a,
  pink-500: #e91e63,
  pink-600: #d81b60,
  pink-700: #c2185b,
  pink-800: #ad1457,
  pink-900: #880e4f,
  pink-A100: #ff80ab,
  pink-A200: #ff4081,
  pink-A400: #f50057,
  pink-A700: #c51162,
  purple-50: #f3e5f5,
  purple-100: #e1bee7,
  purple-200: #ce93d8,
  purple-300: #ba68c8,
  purple-400: #ab47bc,
  purple-500: #9c27b0,
  purple-600: #8e24aa,
  purple-700: #7b1fa2,
  purple-800: #6a1b9a,
  purple-900: #4a148c,
  purple-A100: #ea80fc,
  purple-A200: #e040fb,
  purple-A400: #d500f9,
  purple-A700: #aa00ff,
  deeppurple-50: #ede7f6,
  deeppurple-100: #d1c4e9,
  deeppurple-200: #b39ddb,
  deeppurple-300: #9575cd,
  deeppurple-400: #7e57c2,
  deeppurple-500: #673ab7,
  deeppurple-600: #5e35b1,
  deeppurple-700: #512da8,
  deeppurple-800: #4527a0,
  deeppurple-900: #311b92,
  deeppurple-A100: #b388ff,
  deeppurple-A200: #7c4dff,
  deeppurple-A400: #651fff,
  deeppurple-A700: #6200ea,
  indigo-50: #e8eaf6,
  indigo-100: #c5cae9,
  indigo-200: #9fa8da,
  indigo-300: #7986cb,
  indigo-400: #5c6bc0,
  indigo-500: #3f51b5,
  indigo-600: #3949ab,
  indigo-700: #303f9f,
  indigo-800: #283593,
  indigo-900: #1a237e,
  indigo-A100: #8c9eff,
  indigo-A200: #536dfe,
  indigo-A400: #3d5afe,
  indigo-A700: #304ffe,
  blue-50: #e3f2fd,
  blue-100: #bbdefb,
  blue-200: #90caf9,
  blue-300: #64b5f6,
  blue-400: #42a5f5,
  blue-500: #2196f3,
  blue-600: #1e88e5,
  blue-700: #1976d2,
  blue-800: #1565c0,
  blue-900: #0d47a1,
  blue-A100: #82b1ff,
  blue-A200: #448aff,
  blue-A400: #2979ff,
  blue-A700: #2962ff,
  lightblue-50: #e1f5fe,
  lightblue-100: #b3e5fc,
  lightblue-200: #81d4fa,
  lightblue-300: #4fc3f7,
  lightblue-400: #29b6f6,
  lightblue-500: #03a9f4,
  lightblue-600: #039be5,
  lightblue-700: #0288d1,
  lightblue-800: #0277bd,
  lightblue-900: #01579b,
  lightblue-A100: #80d8ff,
  lightblue-A200: #40c4ff,
  lightblue-A400: #00b0ff,
  lightblue-A700: #0091ea,
  cyan-50: #e0f7fa,
  cyan-100: #b2ebf2,
  cyan-200: #80deea,
  cyan-300: #4dd0e1,
  cyan-400: #26c6da,
  cyan-500: #00bcd4,
  cyan-600: #00acc1,
  cyan-700: #0097a7,
  cyan-800: #00838f,
  cyan-900: #006064,
  cyan-A100: #84ffff,
  cyan-A200: #18ffff,
  cyan-A400: #00e5ff,
  cyan-A700: #00b8d4,
  teal-50: #e0f2f1,
  teal-100: #b2dfdb,
  teal-200: #80cbc4,
  teal-300: #4db6ac,
  teal-400: #26a69a,
  teal-500: #009688,
  teal-600: #00897b,
  teal-700: #00796b,
  teal-800: #00695c,
  teal-900: #004d40,
  teal-A100: #a7ffeb,
  teal-A200: #64ffda,
  teal-A400: #1de9b6,
  teal-A700: #00bfa5,
  green-50: #e8f5e9,
  green-100: #c8e6c9,
  green-200: #a5d6a7,
  green-300: #81c784,
  green-400: #66bb6a,
  green-500: #4caf50,
  green-600: #43a047,
  green-700: #388e3c,
  green-800: #2e7d32,
  green-900: #1b5e20,
  green-A100: #b9f6ca,
  green-A200: #69f0ae,
  green-A400: #00e676,
  green-A700: #00c853,
  lightgreen-50: #f1f8e9,
  lightgreen-100: #dcedc8,
  lightgreen-200: #c5e1a5,
  lightgreen-300: #aed581,
  lightgreen-400: #9ccc65,
  lightgreen-500: #8bc34a,
  lightgreen-600: #7cb342,
  lightgreen-700: #689f38,
  lightgreen-800: #558b2f,
  lightgreen-900: #33691e,
  lightgreen-A100: #ccff90,
  lightgreen-A200: #b2ff59,
  lightgreen-A400: #76ff03,
  lightgreen-A700: #64dd17,
  lime-50: #f9fbe7,
  lime-100: #f0f4c3,
  lime-200: #e6ee9c,
  lime-300: #dce775,
  lime-400: #d4e157,
  lime-500: #cddc39,
  lime-600: #c0ca33,
  lime-700: #afb42b,
  lime-800: #9e9d24,
  lime-900: #827717,
  lime-A100: #f4ff81,
  lime-A200: #eeff41,
  lime-A400: #c6ff00,
  lime-A700: #aeea00,
  yellow-50: #fffde7,
  yellow-100: #fff9c4,
  yellow-200: #fff59d,
  yellow-300: #fff176,
  yellow-400: #ffee58,
  yellow-500: #ffeb3b,
  yellow-600: #fdd835,
  yellow-700: #fbc02d,
  yellow-800: #f9a825,
  yellow-900: #f57f17,
  yellow-A100: #ffff8d,
  yellow-A200: #ffff00,
  yellow-A400: #ffea00,
  yellow-A700: #ffd600,
  amber-50: #fff8e1,
  amber-100: #ffecb3,
  amber-200: #ffe082,
  amber-300: #ffd54f,
  amber-400: #ffca28,
  amber-500: #ffc107,
  amber-600: #ffb300,
  amber-700: #ffa000,
  amber-800: #ff8f00,
  amber-900: #ff6f00,
  amber-A100: #ffe57f,
  amber-A200: #ffd740,
  amber-A400: #ffc400,
  amber-A700: #ffab00,
  orange-50: #fff3e0,
  orange-100: #ffe0b2,
  orange-200: #ffcc80,
  orange-300: #ffb74d,
  orange-400: #ffa726,
  orange-500: #ff9800,
  orange-600: #fb8c00,
  orange-700: #f57c00,
  orange-800: #ef6c00,
  orange-900: #e65100,
  orange-A100: #ffd180,
  orange-A200: #ffab40,
  orange-A400: #ff9100,
  orange-A700: #ff6d00,
  deeporange-50: #fbe9e7,
  deeporange-100: #ffccbc,
  deeporange-200: #ffab91,
  deeporange-300: #ff8a65,
  deeporange-400: #ff7043,
  deeporange-500: #ff5722,
  deeporange-600: #f4511e,
  deeporange-700: #e64a19,
  deeporange-800: #d84315,
  deeporange-900: #bf360c,
  deeporange-A100: #ff9e80,
  deeporange-A200: #ff6e40,
  deeporange-A400: #ff3d00,
  deeporange-A700: #dd2c00,
  brown-50: #efebe9,
  brown-100: #d7ccc8,
  brown-200: #bcaaa4,
  brown-300: #a1887f,
  brown-400: #8d6e63,
  brown-500: #795548,
  brown-600: #6d4c41,
  brown-700: #5d4037,
  brown-800: #4e342e,
  brown-900: #3e2723,
  gray-50: #fafafa,
  gray-100: #f5f5f5,
  gray-200: #eeeeee,
  gray-300: #e0e0e0,
  gray-400: #bdbdbd,
  gray-500: #9e9e9e,
  gray-600: #757575,
  gray-700: #616161,
  gray-800: #424242,
  gray-900: #212121,
  bluegray-50: #eceff1,
  bluegray-100: #cfd8dc,
  bluegray-200: #b0bec5,
  bluegray-300: #90a4ae,
  bluegray-400: #78909c,
  bluegray-500: #607d8b,
  bluegray-600: #546e7a,
  bluegray-700: #455a64,
  bluegray-800: #37474f,
  bluegray-900: #263238,
  black: #000000,
  white: #ffffff,
  transparent: transparent,
) !default;

$spacing: (
  px: 1px,
  0: 0px,
  0.5: 0.125rem,
  1: 0.25rem,
  1.5: 0.375rem,
  2: 0.5rem,
  2.5: 0.625rem,
  3: 0.75rem,
  3.5: 0.875rem,
  4: 1rem,
  5: 1.25rem,
  6: 1.5rem,
  7: 1.75rem,
  8: 2rem,
  9: 2.25rem,
  10: 2.5rem,
  11: 2.75rem,
  12: 3rem,
  14: 3.5rem,
  16: 4rem,
  20: 5rem,
  24: 6rem,
  28: 7rem,
  32: 8rem,
  36: 9rem,
  40: 10rem,
  44: 11rem,
  48: 12rem,
  52: 13rem,
  56: 14rem,
  60: 15rem,
  64: 16rem,
  72: 18rem,
  80: 20rem,
  96: 24rem,
) !default;

$negative-spacing: negative-map($spacing) !default;

$object-position: (
  bottom: bottom,
  center: center,
  left: left,
  left-bottom: left bottom,
  left-top: left top,
  right: right,
  right-bottom: right bottom,
  right-top: right top,
  top: top,
) !default;

$position-base: (
  auto: auto,
  "1\\/2": 50%,
  "1\\/3": 33.333333%,
  "2\\/3": 66.666667%,
  "1\\/4": 25%,
  "2\\/4": 50%,
  "3\\/4": 75%,
  full: 100%,
  "-1\\/2": -50%,
  "-1\\/3": -33.333333%,
  "-2\\/3": -66.666667%,
  "-1\\/4": -25%,
  "-2\\/4": -50%,
  "-3\\/4": -75%,
  "-full": -100%,
) !default;

$position-values: map-merge(
  map-merge($position-base, $spacing),
  $negative-spacing
) !default;

$z-index: (
  auto: "auto",
  0: 0,
  1: 1,
  2: 2,
  3: 3,
  4: 4,
  5: 5,
  6: 6,
  7: 7,
  8: 8,
  9: 9,
  10: 10,
  20: 20,
  30: 30,
  40: 40,
  50: 50,
) !default;

$flex: (
  1: "1 1 0%",
  auto: "1 1 auto",
  initial: "0 1 auto",
  none: none,
) !default;

$flex-grow: (
  none: 0,
  "": 1,
) !default;

$flex-shrink: (
  no: 0,
  "": 1,
) !default;

$order: (
  first: "-9999",
  last: "9999",
  none: "0",
  1: "1",
  2: "2",
  3: "3",
  4: "4",
  5: "5",
  6: "6",
  7: "7",
  8: "8",
  9: "9",
  10: "10",
  11: "11",
  12: "12",
) !default;

$grid-auto-columns: (
  auto: "auto",
  min: "min-content",
  max: "max-content",
  fr: "minmax(0, 1fr)",
) !default;

$grid-auto-rows: (
  auto: "auto",
  min: "min-content",
  max: "max-content",
  fr: "minmax(0, 1fr)",
) !default;

$grid-column: (
  auto: "auto",
  "span-1": "span 1 / span 1",
  "span-2": "span 2 / span 2",
  "span-3": "span 3 / span 3",
  "span-4": "span 4 / span 4",
  "span-5": "span 5 / span 5",
  "span-6": "span 6 / span 6",
  "span-7": "span 7 / span 7",
  "span-8": "span 8 / span 8",
  "span-9": "span 9 / span 9",
  "span-10": "span 10 / span 10",
  "span-11": "span 11 / span 11",
  "span-12": "span 12 / span 12",
  "span-full": "1 / -1",
) !default;

$grid-column-end: (
  auto: "auto",
  1: "1",
  2: "2",
  3: "3",
  4: "4",
  5: "5",
  6: "6",
  7: "7",
  8: "8",
  9: "9",
  10: "10",
  11: "11",
  12: "12",
  13: "13",
) !default;
$grid-column-start: (
  auto: "auto",
  1: "1",
  2: "2",
  3: "3",
  4: "4",
  5: "5",
  6: "6",
  7: "7",
  8: "8",
  9: "9",
  10: "10",
  11: "11",
  12: "12",
  13: "13",
) !default;

$grid-row: (
  auto: "auto",
  "span-1": "span 1 / span 1",
  "span-2": "span 2 / span 2",
  "span-3": "span 3 / span 3",
  "span-4": "span 4 / span 4",
  "span-5": "span 5 / span 5",
  "span-6": "span 6 / span 6",
  "span-full": "1 / -1",
) !default;

$grid-row-start: (
  auto: "auto",
  1: "1",
  2: "2",
  3: "3",
  4: "4",
  5: "5",
  6: "6",
  7: "7",
) !default;

$grid-row-end: (
  auto: "auto",
  1: "1",
  2: "2",
  3: "3",
  4: "4",
  5: "5",
  6: "6",
  7: "7",
) !default;

$grid-template-columns: (
  none: "none",
  1: "repeat(1, minmax(0, 1fr))",
  2: "repeat(2, minmax(0, 1fr))",
  3: "repeat(3, minmax(0, 1fr))",
  4: "repeat(4, minmax(0, 1fr))",
  5: "repeat(5, minmax(0, 1fr))",
  6: "repeat(6, minmax(0, 1fr))",
  7: "repeat(7, minmax(0, 1fr))",
  8: "repeat(8, minmax(0, 1fr))",
  9: "repeat(9, minmax(0, 1fr))",
  10: "repeat(10, minmax(0, 1fr))",
  11: "repeat(11, minmax(0, 1fr))",
  12: "repeat(12, minmax(0, 1fr))",
) !default;

$grid-template-rows: (
  none: "none",
  1: "repeat(1, minmax(0, 1fr))",
  2: "repeat(2, minmax(0, 1fr))",
  3: "repeat(3, minmax(0, 1fr))",
  4: "repeat(4, minmax(0, 1fr))",
  5: "repeat(5, minmax(0, 1fr))",
  6: "repeat(6, minmax(0, 1fr))",
) !default;

$gap: $spacing !default;

$padding: $spacing !default;

$margin: map-merge(
  map-merge(
    (
      auto: auto,
    ),
    $spacing
  ),
  $negative-spacing
) !default;

$width: map-merge(
  (
    auto: "auto",
    "1\\/2": "50%",
    "1\\/3": "33.333333%",
    "2\\/3": "66.666667%",
    "1\\/4": "25%",
    "2\\/4": "50%",
    "3\\/4": "75%",
    "1\\/5": "20%",
    "2\\/5": "40%",
    "3\\/5": "60%",
    "4\\/5": "80%",
    "1\\/6": "16.666667%",
    "2\\/6": "33.333333%",
    "3\\/6": "50%",
    "4\\/6": "66.666667%",
    "5\\/6": "83.333333%",
    "1\\/12": "8.333333%",
    "2\\/12": "16.666667%",
    "3\\/12": "25%",
    "4\\/12": "33.333333%",
    "5\\/12": "41.666667%",
    "6\\/12": "50%",
    "7\\/12": "58.333333%",
    "8\\/12": "66.666667%",
    "9\\/12": "75%",
    "10\\/12": "83.333333%",
    "11\\/12": "91.666667%",
    full: "100%",
    screen: "100vw",
    min: "min-content",
    max: "max-content",
  ),
  $spacing
) !default;

$height: $width !default;

$min-width: (
  0: 0,
  full: 100%,
  min: min-content,
  max: max-content,
) !default;

$max-width: (
  none: none,
  0: 0rem,
  xs: 20rem,
  sm: 24rem,
  md: 28rem,
  lg: 32rem,
  xl: 36rem,
  2xl: 42rem,
  3xl: 48rem,
  4xl: 56rem,
  5xl: 64rem,
  6xl: 72rem,
  7xl: 80rem,
  full: 100%,
  min: min-content,
  max: max-content,
  prose: 65ch,
) !default;

$min-height: $min-width !default;

$max-height: $max-width !default;

$font-family: (
  sans:
    unquote(
      'ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"'
    ),
  serif: unquote('ui-serif, Georgia, Cambria, "Times New Roman", Times, serif'),
  mono:
    unquote(
      'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace'
    ),
) !default;

$font-size: (
  xs: "0.75rem",
  sm: "0.875rem",
  base: "1rem",
  lg: "1.125rem",
  xl: "1.25rem",
  "2xl": "1.5rem",
  "3xl": "1.875rem",
  "4xl": "2.25rem",
  "5xl": "3rem",
  "6xl": "3.75rem",
  "7xl": "4.5rem",
  "8xl": "6rem",
  "9xl": "8rem",
) !default;

$font-line-height: (
  "1rem",
  "1.25rem",
  "1.5rem",
  "1.75rem",
  "1.75rem",
  "2rem",
  "2.25rem",
  "2.5rem",
  "1",
  "1",
  "1",
  "1",
  "1"
) !default;

$font-weight: (
  thin: "100",
  extralight: "200",
  light: "300",
  normal: "400",
  medium: "500",
  semibold: "600",
  bold: "700",
  extrabold: "800",
  black: "900",
) !default;

$letter-spacing: (
  tighter: "-0.05em",
  tight: "-0.025em",
  normal: "0em",
  wide: "0.025em",
  wider: "0.05em",
  widest: "0.1em",
) !default;

$placeholder-color: $colors !default;

$opacity: (
  0: "0",
  5: "0.05",
  10: "0.1",
  20: "0.2",
  25: "0.25",
  30: "0.3",
  40: "0.4",
  50: "0.5",
  60: "0.6",
  70: "0.7",
  75: "0.75",
  80: "0.8",
  90: "0.9",
  95: "0.95",
  100: "1",
) !default;

$placeholder-opacity: $opacity !default;

$line-height: (
  none: "1",
  tight: "1.25",
  snug: "1.375",
  normal: "1.5",
  relaxed: "1.625",
  loose: "2",
  3: ".75rem",
  4: "1rem",
  5: "1.25rem",
  6: "1.5rem",
  7: "1.75rem",
  8: "2rem",
  9: "2.25rem",
  10: "2.5rem",
) !default;

$background-color: $colors !default;

$background-image: (
  none: "none",
  "gradient-to-t": "linear-gradient(to top, var(--mh-gradient-stops))",
  "gradient-to-tr": "linear-gradient(to top right, var(--mh-gradient-stops))",
  "gradient-to-r": "linear-gradient(to right, var(--mh-gradient-stops))",
  "gradient-to-br": "linear-gradient(to bottom right, var(--mh-gradient-stops))",
  "gradient-to-b": "linear-gradient(to bottom, var(--mh-gradient-stops))",
  "gradient-to-bl": "linear-gradient(to bottom left, var(--mh-gradient-stops))",
  "gradient-to-l": "linear-gradient(to left, var(--mh-gradient-stops))",
  "gradient-to-tl": "linear-gradient(to top left, var(--mh-gradient-stops))",
) !default;

$background-opacity: $opacity !default;

$background-position: (
  bottom: "bottom",
  center: "center",
  left: "left",
  "left-bottom": "left bottom",
  "left-top": "left top",
  right: "right",
  "right-bottom": "right bottom",
  "right-top": "right top",
  top: "top",
) !default;

$background-size: (
  auto: "auto",
  cover: "cover",
  contain: "contain",
) !default;

@mixin css($prefix: "") {
  $prefix: "";
  $sep: ":";

  // Layout

  .#{$prefix}border-box {
    box-sizing: border-box;
  }
  .#{$prefix}content-box {
    box-sizing: content-box;
  }

  @each $type
    in (
      inline
        inline-block
        block
        grid
        table
        table-row
        table-caption
        table-cell
        table-raw
        table-column
        table-column-group
        table-footer-group
        table-raw-group
        flex
        inline-flex
        flow-root
        grid
        inline-grid
        contents
        none
    )
  {
    .#{$prefix}#{$type} {
      display: #{$type};
    }
  }

  .#{$prefix}float {
    @each $value in (left right none) {
      &#{$sep}#{$value} {
        float: #{$value};
      }
    }
  }

  .#{$prefix}clear {
    @each $value in (left right both none) {
      &#{$sep}#{$value} {
        clear: #{$value};
      }
    }
  }

  .#{$prefix}object-fit {
    @each $value in (contain cover fill none scale-down) {
      &#{$sep}#{$value} {
        object-fit: #{$value};
      }
    }
  }

  .#{$prefix}object-position {
    @each $key, $value in $object-position {
      &#{$sep}#{$key} {
        object-position: #{$value};
      }
    }
  }

  .#{$prefix}overflow {
    @each $value in (auto hidden visible scroll) {
      &#{$sep}#{$value} {
        overflow: #{$value};
      }
      &-x#{$sep}#{$value} {
        overflow-x: #{$value};
      }
      &-y#{$sep}-y#{$value} {
        overflow-y: #{$value};
      }
    }
  }

  .#{$prefix}overscroll {
    @each $value in (auto contain none) {
      &#{$sep}#{$value} {
        overscroll-behavior: #{$value};
      }
      &-x#{$sep}#{$value} {
        overscroll-behavior-x: #{$value};
      }
      &-y#{$sep}-y#{$value} {
        overscroll-behavior-y: #{$value};
      }
    }
  }
}
@include css();

output.css

.border-box {
  box-sizing: border-box;
}

.content-box {
  box-sizing: content-box;
}

.inline {
  display: inline;
}

.inline-block {
  display: inline-block;
}

.block {
  display: block;
}

.grid {
  display: grid;
}

.table {
  display: table;
}

.table-row {
  display: table-row;
}

.table-caption {
  display: table-caption;
}

.table-cell {
  display: table-cell;
}

.table-raw {
  display: table-raw;
}

.table-column {
  display: table-column;
}

.table-column-group {
  display: table-column-group;
}

.table-footer-group {
  display: table-footer-group;
}

.table-raw-group {
  display: table-raw-group;
}

.flex {
  display: flex;
}

.inline-flex {
  display: inline-flex;
}

.flow-root {
  display: flow-root;
}

.grid {
  display: grid;
}

.inline-grid {
  display: inline-grid;
}

.contents {
  display: contents;
}

.none {
  display: none;
}

.float:left {
  float: left;
}
.float:right {
  float: right;
}
.float:none {
  float: none;
}

.clear:left {
  clear: left;
}
.clear:right {
  clear: right;
}
.clear:both {
  clear: both;
}
.clear:none {
  clear: none;
}

.object-fit:contain {
  object-fit: contain;
}
.object-fit:cover {
  object-fit: cover;
}
.object-fit:fill {
  object-fit: fill;
}
.object-fit:none {
  object-fit: none;
}
.object-fit:scale-down {
  object-fit: scale-down;
}

.object-position:bottom {
  object-position: bottom;
}
.object-position:center {
  object-position: center;
}
.object-position:left {
  object-position: left;
}
.object-position:left-bottom {
  object-position: left bottom;
}
.object-position:left-top {
  object-position: left top;
}
.object-position:right {
  object-position: right;
}
.object-position:right-bottom {
  object-position: right bottom;
}
.object-position:right-top {
  object-position: right top;
}
.object-position:top {
  object-position: top;
}

.overflow:auto {
  overflow: auto;
}
.overflow-x:auto {
  overflow-x: auto;
}
.overflow-y:-yauto {
  overflow-y: auto;
}
.overflow:hidden {
  overflow: hidden;
}
.overflow-x:hidden {
  overflow-x: hidden;
}
.overflow-y:-yhidden {
  overflow-y: hidden;
}
.overflow:visible {
  overflow: visible;
}
.overflow-x:visible {
  overflow-x: visible;
}
.overflow-y:-yvisible {
  overflow-y: visible;
}
.overflow:scroll {
  overflow: scroll;
}
.overflow-x:scroll {
  overflow-x: scroll;
}
.overflow-y:-yscroll {
  overflow-y: scroll;
}

.overscroll:auto {
  overscroll-behavior: auto;
}
.overscroll-x:auto {
  overscroll-behavior-x: auto;
}
.overscroll-y:-yauto {
  overscroll-behavior-y: auto;
}
.overscroll:contain {
  overscroll-behavior: contain;
}
.overscroll-x:contain {
  overscroll-behavior-x: contain;
}
.overscroll-y:-ycontain {
  overscroll-behavior-y: contain;
}
.overscroll:none {
  overscroll-behavior: none;
}
.overscroll-x:none {
  overscroll-behavior-x: none;
}
.overscroll-y:-ynone {
  overscroll-behavior-y: none;
}

settings.json

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