/*
This file was generated by running

  $ node ./scripts/whitespace.js > packages/gestalt/src/boxWhitespace.css

*/

html:not([dir="rtl"]) .marginStartAuto {
  margin-left: auto;
}

html:not([dir="rtl"]) .marginEndAuto {
  margin-right: auto;
}

html[dir="rtl"] .marginStartAuto {
  margin-right: auto;
}

html[dir="rtl"] .marginEndAuto {
  margin-left: auto;
}

.marginTopAuto {
  margin-top: auto;
}

.marginBottomAuto {
  margin-bottom: auto;
}

html:not([dir="rtl"]) .marginStart0 {
  margin-left: var(--space-0);
}

html:not([dir="rtl"]) .marginEnd0 {
  margin-right: var(--space-0);
}

html[dir="rtl"] .marginStart0 {
  margin-right: var(--space-0);
}

html[dir="rtl"] .marginEnd0 {
  margin-left: var(--space-0);
}

.marginTop0 {
  margin-top: var(--space-0);
}

.marginBottom0 {
  margin-bottom: var(--space-0);
}

.paddingY0 {
  padding-bottom: var(--space-0);
  padding-top: var(--space-0);
}

.paddingX0 {
  padding-left: var(--space-0);
  padding-right: var(--space-0);
}

html:not([dir="rtl"]) .marginStart25 {
  margin-left: 1px;
}

html:not([dir="rtl"]) .marginEnd25 {
  margin-right: 1px;
}

html[dir="rtl"] .marginStart25 {
  margin-right: 1px;
}

html[dir="rtl"] .marginEnd25 {
  margin-left: 1px;
}

html:not([dir="rtl"]) .marginStartN25 {
  margin-left: -1px;
}

html:not([dir="rtl"]) .marginEndN25 {
  margin-right: -1px;
}

html[dir="rtl"] .marginStartN25 {
  margin-right: -1px;
}

html[dir="rtl"] .marginEndN25 {
  margin-left: -1px;
}

.marginTop25 {
  margin-top: 1px;
}

.marginBottom25 {
  margin-bottom: 1px;
}

.marginTopN25 {
  margin-top: -1px;
}

.marginBottomN25 {
  margin-bottom: -1px;
}

.paddingY25 {
  padding-bottom: 1px;
  padding-top: 1px;
}

.paddingX25 {
  padding-left: 1px;
  padding-right: 1px;
}

html:not([dir="rtl"]) .marginStart50 {
  margin-left: 2px;
}

html:not([dir="rtl"]) .marginEnd50 {
  margin-right: 2px;
}

html[dir="rtl"] .marginStart50 {
  margin-right: 2px;
}

html[dir="rtl"] .marginEnd50 {
  margin-left: 2px;
}

html:not([dir="rtl"]) .marginStartN50 {
  margin-left: -2px;
}

html:not([dir="rtl"]) .marginEndN50 {
  margin-right: -2px;
}

html[dir="rtl"] .marginStartN50 {
  margin-right: -2px;
}

html[dir="rtl"] .marginEndN50 {
  margin-left: -2px;
}

.marginTop50 {
  margin-top: 2px;
}

.marginBottom50 {
  margin-bottom: 2px;
}

.marginTopN50 {
  margin-top: -2px;
}

.marginBottomN50 {
  margin-bottom: -2px;
}

.paddingY50 {
  padding-bottom: 2px;
  padding-top: 2px;
}

.paddingX50 {
  padding-left: 2px;
  padding-right: 2px;
}

html:not([dir="rtl"]) .marginStart100 {
  margin-left: var(--space-100);
}

html:not([dir="rtl"]) .marginEnd100 {
  margin-right: var(--space-100);
}

html[dir="rtl"] .marginStart100 {
  margin-right: var(--space-100);
}

html[dir="rtl"] .marginEnd100 {
  margin-left: var(--space-100);
}

html:not([dir="rtl"]) .marginStartN100 {
  margin-left: var(--space-negative-100);
}

html:not([dir="rtl"]) .marginEndN100 {
  margin-right: var(--space-negative-100);
}

html[dir="rtl"] .marginStartN100 {
  margin-right: var(--space-negative-100);
}

html[dir="rtl"] .marginEndN100 {
  margin-left: var(--space-negative-100);
}

.marginTop100 {
  margin-top: var(--space-100);
}

.marginBottom100 {
  margin-bottom: var(--space-100);
}

.marginTopN100 {
  margin-top: var(--space-negative-100);
}

.marginBottomN100 {
  margin-bottom: var(--space-negative-100);
}

.paddingY100 {
  padding-bottom: var(--space-100);
  padding-top: var(--space-100);
}

.paddingX100 {
  padding-left: var(--space-100);
  padding-right: var(--space-100);
}

html:not([dir="rtl"]) .marginStart150 {
  margin-left: 6px;
}

html:not([dir="rtl"]) .marginEnd150 {
  margin-right: 6px;
}

html[dir="rtl"] .marginStart150 {
  margin-right: 6px;
}

html[dir="rtl"] .marginEnd150 {
  margin-left: 6px;
}

html:not([dir="rtl"]) .marginStartN150 {
  margin-left: -6px;
}

html:not([dir="rtl"]) .marginEndN150 {
  margin-right: -6px;
}

html[dir="rtl"] .marginStartN150 {
  margin-right: -6px;
}

html[dir="rtl"] .marginEndN150 {
  margin-left: -6px;
}

.marginTop150 {
  margin-top: 6px;
}

.marginBottom150 {
  margin-bottom: 6px;
}

.marginTopN150 {
  margin-top: -6px;
}

.marginBottomN150 {
  margin-bottom: -6px;
}

.paddingY150 {
  padding-bottom: 6px;
  padding-top: 6px;
}

.paddingX150 {
  padding-left: 6px;
  padding-right: 6px;
}

html:not([dir="rtl"]) .marginStart1000 {
  margin-left: var(--space-1000);
}

html:not([dir="rtl"]) .marginEnd1000 {
  margin-right: var(--space-1000);
}

html[dir="rtl"] .marginStart1000 {
  margin-right: var(--space-1000);
}

html[dir="rtl"] .marginEnd1000 {
  margin-left: var(--space-1000);
}

html:not([dir="rtl"]) .marginStartN1000 {
  margin-left: var(--space-negative-1000);
}

html:not([dir="rtl"]) .marginEndN1000 {
  margin-right: var(--space-negative-1000);
}

html[dir="rtl"] .marginStartN1000 {
  margin-right: var(--space-negative-1000);
}

html[dir="rtl"] .marginEndN1000 {
  margin-left: var(--space-negative-1000);
}

.marginTop1000 {
  margin-top: var(--space-1000);
}

.marginBottom1000 {
  margin-bottom: var(--space-1000);
}

.marginTopN1000 {
  margin-top: var(--space-negative-1000);
}

.marginBottomN1000 {
  margin-bottom: var(--space-negative-1000);
}

.paddingY1000 {
  padding-bottom: var(--space-1000);
  padding-top: var(--space-1000);
}

.paddingX1000 {
  padding-left: var(--space-1000);
  padding-right: var(--space-1000);
}

html:not([dir="rtl"]) .marginStart1100 {
  margin-left: var(--space-1100);
}

html:not([dir="rtl"]) .marginEnd1100 {
  margin-right: var(--space-1100);
}

html[dir="rtl"] .marginStart1100 {
  margin-right: var(--space-1100);
}

html[dir="rtl"] .marginEnd1100 {
  margin-left: var(--space-1100);
}

html:not([dir="rtl"]) .marginStartN1100 {
  margin-left: var(--space-negative-1100);
}

html:not([dir="rtl"]) .marginEndN1100 {
  margin-right: var(--space-negative-1100);
}

html[dir="rtl"] .marginStartN1100 {
  margin-right: var(--space-negative-1100);
}

html[dir="rtl"] .marginEndN1100 {
  margin-left: var(--space-negative-1100);
}

.marginTop1100 {
  margin-top: var(--space-1100);
}

.marginBottom1100 {
  margin-bottom: var(--space-1100);
}

.marginTopN1100 {
  margin-top: var(--space-negative-1100);
}

.marginBottomN1100 {
  margin-bottom: var(--space-negative-1100);
}

.paddingY1100 {
  padding-bottom: var(--space-1100);
  padding-top: var(--space-1100);
}

.paddingX1100 {
  padding-left: var(--space-1100);
  padding-right: var(--space-1100);
}

html:not([dir="rtl"]) .marginStart1200 {
  margin-left: var(--space-1200);
}

html:not([dir="rtl"]) .marginEnd1200 {
  margin-right: var(--space-1200);
}

html[dir="rtl"] .marginStart1200 {
  margin-right: var(--space-1200);
}

html[dir="rtl"] .marginEnd1200 {
  margin-left: var(--space-1200);
}

html:not([dir="rtl"]) .marginStartN1200 {
  margin-left: var(--space-negative-1200);
}

html:not([dir="rtl"]) .marginEndN1200 {
  margin-right: var(--space-negative-1200);
}

html[dir="rtl"] .marginStartN1200 {
  margin-right: var(--space-negative-1200);
}

html[dir="rtl"] .marginEndN1200 {
  margin-left: var(--space-negative-1200);
}

.marginTop1200 {
  margin-top: var(--space-1200);
}

.marginBottom1200 {
  margin-bottom: var(--space-1200);
}

.marginTopN1200 {
  margin-top: var(--space-negative-1200);
}

.marginBottomN1200 {
  margin-bottom: var(--space-negative-1200);
}

.paddingY1200 {
  padding-bottom: var(--space-1200);
  padding-top: var(--space-1200);
}

.paddingX1200 {
  padding-left: var(--space-1200);
  padding-right: var(--space-1200);
}

html:not([dir="rtl"]) .marginStart1300 {
  margin-left: var(--space-1300);
}

html:not([dir="rtl"]) .marginEnd1300 {
  margin-right: var(--space-1300);
}

html[dir="rtl"] .marginStart1300 {
  margin-right: var(--space-1300);
}

html[dir="rtl"] .marginEnd1300 {
  margin-left: var(--space-1300);
}

html:not([dir="rtl"]) .marginStartN1300 {
  margin-left: var(--space-negative-1300);
}

html:not([dir="rtl"]) .marginEndN1300 {
  margin-right: var(--space-negative-1300);
}

html[dir="rtl"] .marginStartN1300 {
  margin-right: var(--space-negative-1300);
}

html[dir="rtl"] .marginEndN1300 {
  margin-left: var(--space-negative-1300);
}

.marginTop1300 {
  margin-top: var(--space-1300);
}

.marginBottom1300 {
  margin-bottom: var(--space-1300);
}

.marginTopN1300 {
  margin-top: var(--space-negative-1300);
}

.marginBottomN1300 {
  margin-bottom: var(--space-negative-1300);
}

.paddingY1300 {
  padding-bottom: var(--space-1300);
  padding-top: var(--space-1300);
}

.paddingX1300 {
  padding-left: var(--space-1300);
  padding-right: var(--space-1300);
}

html:not([dir="rtl"]) .marginStart1400 {
  margin-left: var(--space-1400);
}

html:not([dir="rtl"]) .marginEnd1400 {
  margin-right: var(--space-1400);
}

html[dir="rtl"] .marginStart1400 {
  margin-right: var(--space-1400);
}

html[dir="rtl"] .marginEnd1400 {
  margin-left: var(--space-1400);
}

html:not([dir="rtl"]) .marginStartN1400 {
  margin-left: var(--space-negative-1400);
}

html:not([dir="rtl"]) .marginEndN1400 {
  margin-right: var(--space-negative-1400);
}

html[dir="rtl"] .marginStartN1400 {
  margin-right: var(--space-negative-1400);
}

html[dir="rtl"] .marginEndN1400 {
  margin-left: var(--space-negative-1400);
}

.marginTop1400 {
  margin-top: var(--space-1400);
}

.marginBottom1400 {
  margin-bottom: var(--space-1400);
}

.marginTopN1400 {
  margin-top: var(--space-negative-1400);
}

.marginBottomN1400 {
  margin-bottom: var(--space-negative-1400);
}

.paddingY1400 {
  padding-bottom: var(--space-1400);
  padding-top: var(--space-1400);
}

.paddingX1400 {
  padding-left: var(--space-1400);
  padding-right: var(--space-1400);
}

html:not([dir="rtl"]) .marginStart1500 {
  margin-left: var(--space-1500);
}

html:not([dir="rtl"]) .marginEnd1500 {
  margin-right: var(--space-1500);
}

html[dir="rtl"] .marginStart1500 {
  margin-right: var(--space-1500);
}

html[dir="rtl"] .marginEnd1500 {
  margin-left: var(--space-1500);
}

html:not([dir="rtl"]) .marginStartN1500 {
  margin-left: var(--space-negative-1500);
}

html:not([dir="rtl"]) .marginEndN1500 {
  margin-right: var(--space-negative-1500);
}

html[dir="rtl"] .marginStartN1500 {
  margin-right: var(--space-negative-1500);
}

html[dir="rtl"] .marginEndN1500 {
  margin-left: var(--space-negative-1500);
}

.marginTop1500 {
  margin-top: var(--space-1500);
}

.marginBottom1500 {
  margin-bottom: var(--space-1500);
}

.marginTopN1500 {
  margin-top: var(--space-negative-1500);
}

.marginBottomN1500 {
  margin-bottom: var(--space-negative-1500);
}

.paddingY1500 {
  padding-bottom: var(--space-1500);
  padding-top: var(--space-1500);
}

.paddingX1500 {
  padding-left: var(--space-1500);
  padding-right: var(--space-1500);
}

html:not([dir="rtl"]) .marginStart1600 {
  margin-left: var(--space-1600);
}

html:not([dir="rtl"]) .marginEnd1600 {
  margin-right: var(--space-1600);
}

html[dir="rtl"] .marginStart1600 {
  margin-right: var(--space-1600);
}

html[dir="rtl"] .marginEnd1600 {
  margin-left: var(--space-1600);
}

html:not([dir="rtl"]) .marginStartN1600 {
  margin-left: var(--space-negative-1600);
}

html:not([dir="rtl"]) .marginEndN1600 {
  margin-right: var(--space-negative-1600);
}

html[dir="rtl"] .marginStartN1600 {
  margin-right: var(--space-negative-1600);
}

html[dir="rtl"] .marginEndN1600 {
  margin-left: var(--space-negative-1600);
}

.marginTop1600 {
  margin-top: var(--space-1600);
}

.marginBottom1600 {
  margin-bottom: var(--space-1600);
}

.marginTopN1600 {
  margin-top: var(--space-negative-1600);
}

.marginBottomN1600 {
  margin-bottom: var(--space-negative-1600);
}

.paddingY1600 {
  padding-bottom: var(--space-1600);
  padding-top: var(--space-1600);
}

.paddingX1600 {
  padding-left: var(--space-1600);
  padding-right: var(--space-1600);
}

html:not([dir="rtl"]) .marginStart200 {
  margin-left: var(--space-200);
}

html:not([dir="rtl"]) .marginEnd200 {
  margin-right: var(--space-200);
}

html[dir="rtl"] .marginStart200 {
  margin-right: var(--space-200);
}

html[dir="rtl"] .marginEnd200 {
  margin-left: var(--space-200);
}

html:not([dir="rtl"]) .marginStartN200 {
  margin-left: var(--space-negative-200);
}

html:not([dir="rtl"]) .marginEndN200 {
  margin-right: var(--space-negative-200);
}

html[dir="rtl"] .marginStartN200 {
  margin-right: var(--space-negative-200);
}

html[dir="rtl"] .marginEndN200 {
  margin-left: var(--space-negative-200);
}

.marginTop200 {
  margin-top: var(--space-200);
}

.marginBottom200 {
  margin-bottom: var(--space-200);
}

.marginTopN200 {
  margin-top: var(--space-negative-200);
}

.marginBottomN200 {
  margin-bottom: var(--space-negative-200);
}

.paddingY200 {
  padding-bottom: var(--space-200);
  padding-top: var(--space-200);
}

.paddingX200 {
  padding-left: var(--space-200);
  padding-right: var(--space-200);
}

html:not([dir="rtl"]) .marginStart300 {
  margin-left: var(--space-300);
}

html:not([dir="rtl"]) .marginEnd300 {
  margin-right: var(--space-300);
}

html[dir="rtl"] .marginStart300 {
  margin-right: var(--space-300);
}

html[dir="rtl"] .marginEnd300 {
  margin-left: var(--space-300);
}

html:not([dir="rtl"]) .marginStartN300 {
  margin-left: var(--space-negative-300);
}

html:not([dir="rtl"]) .marginEndN300 {
  margin-right: var(--space-negative-300);
}

html[dir="rtl"] .marginStartN300 {
  margin-right: var(--space-negative-300);
}

html[dir="rtl"] .marginEndN300 {
  margin-left: var(--space-negative-300);
}

.marginTop300 {
  margin-top: var(--space-300);
}

.marginBottom300 {
  margin-bottom: var(--space-300);
}

.marginTopN300 {
  margin-top: var(--space-negative-300);
}

.marginBottomN300 {
  margin-bottom: var(--space-negative-300);
}

.paddingY300 {
  padding-bottom: var(--space-300);
  padding-top: var(--space-300);
}

.paddingX300 {
  padding-left: var(--space-300);
  padding-right: var(--space-300);
}

html:not([dir="rtl"]) .marginStart400 {
  margin-left: var(--space-400);
}

html:not([dir="rtl"]) .marginEnd400 {
  margin-right: var(--space-400);
}

html[dir="rtl"] .marginStart400 {
  margin-right: var(--space-400);
}

html[dir="rtl"] .marginEnd400 {
  margin-left: var(--space-400);
}

html:not([dir="rtl"]) .marginStartN400 {
  margin-left: var(--space-negative-400);
}

html:not([dir="rtl"]) .marginEndN400 {
  margin-right: var(--space-negative-400);
}

html[dir="rtl"] .marginStartN400 {
  margin-right: var(--space-negative-400);
}

html[dir="rtl"] .marginEndN400 {
  margin-left: var(--space-negative-400);
}

.marginTop400 {
  margin-top: var(--space-400);
}

.marginBottom400 {
  margin-bottom: var(--space-400);
}

.marginTopN400 {
  margin-top: var(--space-negative-400);
}

.marginBottomN400 {
  margin-bottom: var(--space-negative-400);
}

.paddingY400 {
  padding-bottom: var(--space-400);
  padding-top: var(--space-400);
}

.paddingX400 {
  padding-left: var(--space-400);
  padding-right: var(--space-400);
}

html:not([dir="rtl"]) .marginStart500 {
  margin-left: var(--space-500);
}

html:not([dir="rtl"]) .marginEnd500 {
  margin-right: var(--space-500);
}

html[dir="rtl"] .marginStart500 {
  margin-right: var(--space-500);
}

html[dir="rtl"] .marginEnd500 {
  margin-left: var(--space-500);
}

html:not([dir="rtl"]) .marginStartN500 {
  margin-left: var(--space-negative-500);
}

html:not([dir="rtl"]) .marginEndN500 {
  margin-right: var(--space-negative-500);
}

html[dir="rtl"] .marginStartN500 {
  margin-right: var(--space-negative-500);
}

html[dir="rtl"] .marginEndN500 {
  margin-left: var(--space-negative-500);
}

.marginTop500 {
  margin-top: var(--space-500);
}

.marginBottom500 {
  margin-bottom: var(--space-500);
}

.marginTopN500 {
  margin-top: var(--space-negative-500);
}

.marginBottomN500 {
  margin-bottom: var(--space-negative-500);
}

.paddingY500 {
  padding-bottom: var(--space-500);
  padding-top: var(--space-500);
}

.paddingX500 {
  padding-left: var(--space-500);
  padding-right: var(--space-500);
}

html:not([dir="rtl"]) .marginStart600 {
  margin-left: var(--space-600);
}

html:not([dir="rtl"]) .marginEnd600 {
  margin-right: var(--space-600);
}

html[dir="rtl"] .marginStart600 {
  margin-right: var(--space-600);
}

html[dir="rtl"] .marginEnd600 {
  margin-left: var(--space-600);
}

html:not([dir="rtl"]) .marginStartN600 {
  margin-left: var(--space-negative-600);
}

html:not([dir="rtl"]) .marginEndN600 {
  margin-right: var(--space-negative-600);
}

html[dir="rtl"] .marginStartN600 {
  margin-right: var(--space-negative-600);
}

html[dir="rtl"] .marginEndN600 {
  margin-left: var(--space-negative-600);
}

.marginTop600 {
  margin-top: var(--space-600);
}

.marginBottom600 {
  margin-bottom: var(--space-600);
}

.marginTopN600 {
  margin-top: var(--space-negative-600);
}

.marginBottomN600 {
  margin-bottom: var(--space-negative-600);
}

.paddingY600 {
  padding-bottom: var(--space-600);
  padding-top: var(--space-600);
}

.paddingX600 {
  padding-left: var(--space-600);
  padding-right: var(--space-600);
}

html:not([dir="rtl"]) .marginStart700 {
  margin-left: var(--space-700);
}

html:not([dir="rtl"]) .marginEnd700 {
  margin-right: var(--space-700);
}

html[dir="rtl"] .marginStart700 {
  margin-right: var(--space-700);
}

html[dir="rtl"] .marginEnd700 {
  margin-left: var(--space-700);
}

html:not([dir="rtl"]) .marginStartN700 {
  margin-left: var(--space-negative-700);
}

html:not([dir="rtl"]) .marginEndN700 {
  margin-right: var(--space-negative-700);
}

html[dir="rtl"] .marginStartN700 {
  margin-right: var(--space-negative-700);
}

html[dir="rtl"] .marginEndN700 {
  margin-left: var(--space-negative-700);
}

.marginTop700 {
  margin-top: var(--space-700);
}

.marginBottom700 {
  margin-bottom: var(--space-700);
}

.marginTopN700 {
  margin-top: var(--space-negative-700);
}

.marginBottomN700 {
  margin-bottom: var(--space-negative-700);
}

.paddingY700 {
  padding-bottom: var(--space-700);
  padding-top: var(--space-700);
}

.paddingX700 {
  padding-left: var(--space-700);
  padding-right: var(--space-700);
}

html:not([dir="rtl"]) .marginStart800 {
  margin-left: var(--space-800);
}

html:not([dir="rtl"]) .marginEnd800 {
  margin-right: var(--space-800);
}

html[dir="rtl"] .marginStart800 {
  margin-right: var(--space-800);
}

html[dir="rtl"] .marginEnd800 {
  margin-left: var(--space-800);
}

html:not([dir="rtl"]) .marginStartN800 {
  margin-left: var(--space-negative-800);
}

html:not([dir="rtl"]) .marginEndN800 {
  margin-right: var(--space-negative-800);
}

html[dir="rtl"] .marginStartN800 {
  margin-right: var(--space-negative-800);
}

html[dir="rtl"] .marginEndN800 {
  margin-left: var(--space-negative-800);
}

.marginTop800 {
  margin-top: var(--space-800);
}

.marginBottom800 {
  margin-bottom: var(--space-800);
}

.marginTopN800 {
  margin-top: var(--space-negative-800);
}

.marginBottomN800 {
  margin-bottom: var(--space-negative-800);
}

.paddingY800 {
  padding-bottom: var(--space-800);
  padding-top: var(--space-800);
}

.paddingX800 {
  padding-left: var(--space-800);
  padding-right: var(--space-800);
}

html:not([dir="rtl"]) .marginStart900 {
  margin-left: var(--space-900);
}

html:not([dir="rtl"]) .marginEnd900 {
  margin-right: var(--space-900);
}

html[dir="rtl"] .marginStart900 {
  margin-right: var(--space-900);
}

html[dir="rtl"] .marginEnd900 {
  margin-left: var(--space-900);
}

html:not([dir="rtl"]) .marginStartN900 {
  margin-left: var(--space-negative-900);
}

html:not([dir="rtl"]) .marginEndN900 {
  margin-right: var(--space-negative-900);
}

html[dir="rtl"] .marginStartN900 {
  margin-right: var(--space-negative-900);
}

html[dir="rtl"] .marginEndN900 {
  margin-left: var(--space-negative-900);
}

.marginTop900 {
  margin-top: var(--space-900);
}

.marginBottom900 {
  margin-bottom: var(--space-900);
}

.marginTopN900 {
  margin-top: var(--space-negative-900);
}

.marginBottomN900 {
  margin-bottom: var(--space-negative-900);
}

.paddingY900 {
  padding-bottom: var(--space-900);
  padding-top: var(--space-900);
}

.paddingX900 {
  padding-left: var(--space-900);
  padding-right: var(--space-900);
}

@media (--g-sm) {
  html:not([dir="rtl"]) .smMarginStartAuto {
    margin-left: auto;
  }

  html:not([dir="rtl"]) .smMarginEndAuto {
    margin-right: auto;
  }

  html[dir="rtl"] .smMarginStartAuto {
    margin-right: auto;
  }

  html[dir="rtl"] .smMarginEndAuto {
    margin-left: auto;
  }

  .smMarginTopAuto {
    margin-top: auto;
  }

  .smMarginBottomAuto {
    margin-bottom: auto;
  }
}

@media (--g-sm) {
  html:not([dir="rtl"]) .smMarginStart0 {
    margin-left: var(--space-0);
  }

  html:not([dir="rtl"]) .smMarginEnd0 {
    margin-right: var(--space-0);
  }

  html[dir="rtl"] .smMarginStart0 {
    margin-right: var(--space-0);
  }

  html[dir="rtl"] .smMarginEnd0 {
    margin-left: var(--space-0);
  }

  .smMarginTop0 {
    margin-top: var(--space-0);
  }

  .smMarginBottom0 {
    margin-bottom: var(--space-0);
  }

  .smPaddingY0 {
    padding-bottom: var(--space-0);
    padding-top: var(--space-0);
  }

  .smPaddingX0 {
    padding-left: var(--space-0);
    padding-right: var(--space-0);
  }

  html:not([dir="rtl"]) .smMarginStart25 {
    margin-left: 1px;
  }

  html:not([dir="rtl"]) .smMarginEnd25 {
    margin-right: 1px;
  }

  html[dir="rtl"] .smMarginStart25 {
    margin-right: 1px;
  }

  html[dir="rtl"] .smMarginEnd25 {
    margin-left: 1px;
  }

  html:not([dir="rtl"]) .smMarginStartN25 {
    margin-left: -1px;
  }

  html:not([dir="rtl"]) .smMarginEndN25 {
    margin-right: -1px;
  }

  html[dir="rtl"] .smMarginStartN25 {
    margin-right: -1px;
  }

  html[dir="rtl"] .smMarginEndN25 {
    margin-left: -1px;
  }

  .smMarginTop25 {
    margin-top: 1px;
  }

  .smMarginBottom25 {
    margin-bottom: 1px;
  }

  .smMarginTopN25 {
    margin-top: -1px;
  }

  .smMarginBottomN25 {
    margin-bottom: -1px;
  }

  .smPaddingY25 {
    padding-bottom: 1px;
    padding-top: 1px;
  }

  .smPaddingX25 {
    padding-left: 1px;
    padding-right: 1px;
  }

  html:not([dir="rtl"]) .smMarginStart50 {
    margin-left: 2px;
  }

  html:not([dir="rtl"]) .smMarginEnd50 {
    margin-right: 2px;
  }

  html[dir="rtl"] .smMarginStart50 {
    margin-right: 2px;
  }

  html[dir="rtl"] .smMarginEnd50 {
    margin-left: 2px;
  }

  html:not([dir="rtl"]) .smMarginStartN50 {
    margin-left: -2px;
  }

  html:not([dir="rtl"]) .smMarginEndN50 {
    margin-right: -2px;
  }

  html[dir="rtl"] .smMarginStartN50 {
    margin-right: -2px;
  }

  html[dir="rtl"] .smMarginEndN50 {
    margin-left: -2px;
  }

  .smMarginTop50 {
    margin-top: 2px;
  }

  .smMarginBottom50 {
    margin-bottom: 2px;
  }

  .smMarginTopN50 {
    margin-top: -2px;
  }

  .smMarginBottomN50 {
    margin-bottom: -2px;
  }

  .smPaddingY50 {
    padding-bottom: 2px;
    padding-top: 2px;
  }

  .smPaddingX50 {
    padding-left: 2px;
    padding-right: 2px;
  }

  html:not([dir="rtl"]) .smMarginStart100 {
    margin-left: var(--space-100);
  }

  html:not([dir="rtl"]) .smMarginEnd100 {
    margin-right: var(--space-100);
  }

  html[dir="rtl"] .smMarginStart100 {
    margin-right: var(--space-100);
  }

  html[dir="rtl"] .smMarginEnd100 {
    margin-left: var(--space-100);
  }

  html:not([dir="rtl"]) .smMarginStartN100 {
    margin-left: var(--space-negative-100);
  }

  html:not([dir="rtl"]) .smMarginEndN100 {
    margin-right: var(--space-negative-100);
  }

  html[dir="rtl"] .smMarginStartN100 {
    margin-right: var(--space-negative-100);
  }

  html[dir="rtl"] .smMarginEndN100 {
    margin-left: var(--space-negative-100);
  }

  .smMarginTop100 {
    margin-top: var(--space-100);
  }

  .smMarginBottom100 {
    margin-bottom: var(--space-100);
  }

  .smMarginTopN100 {
    margin-top: var(--space-negative-100);
  }

  .smMarginBottomN100 {
    margin-bottom: var(--space-negative-100);
  }

  .smPaddingY100 {
    padding-bottom: var(--space-100);
    padding-top: var(--space-100);
  }

  .smPaddingX100 {
    padding-left: var(--space-100);
    padding-right: var(--space-100);
  }

  html:not([dir="rtl"]) .smMarginStart150 {
    margin-left: 6px;
  }

  html:not([dir="rtl"]) .smMarginEnd150 {
    margin-right: 6px;
  }

  html[dir="rtl"] .smMarginStart150 {
    margin-right: 6px;
  }

  html[dir="rtl"] .smMarginEnd150 {
    margin-left: 6px;
  }

  html:not([dir="rtl"]) .smMarginStartN150 {
    margin-left: -6px;
  }

  html:not([dir="rtl"]) .smMarginEndN150 {
    margin-right: -6px;
  }

  html[dir="rtl"] .smMarginStartN150 {
    margin-right: -6px;
  }

  html[dir="rtl"] .smMarginEndN150 {
    margin-left: -6px;
  }

  .smMarginTop150 {
    margin-top: 6px;
  }

  .smMarginBottom150 {
    margin-bottom: 6px;
  }

  .smMarginTopN150 {
    margin-top: -6px;
  }

  .smMarginBottomN150 {
    margin-bottom: -6px;
  }

  .smPaddingY150 {
    padding-bottom: 6px;
    padding-top: 6px;
  }

  .smPaddingX150 {
    padding-left: 6px;
    padding-right: 6px;
  }

  html:not([dir="rtl"]) .smMarginStart1000 {
    margin-left: var(--space-1000);
  }

  html:not([dir="rtl"]) .smMarginEnd1000 {
    margin-right: var(--space-1000);
  }

  html[dir="rtl"] .smMarginStart1000 {
    margin-right: var(--space-1000);
  }

  html[dir="rtl"] .smMarginEnd1000 {
    margin-left: var(--space-1000);
  }

  html:not([dir="rtl"]) .smMarginStartN1000 {
    margin-left: var(--space-negative-1000);
  }

  html:not([dir="rtl"]) .smMarginEndN1000 {
    margin-right: var(--space-negative-1000);
  }

  html[dir="rtl"] .smMarginStartN1000 {
    margin-right: var(--space-negative-1000);
  }

  html[dir="rtl"] .smMarginEndN1000 {
    margin-left: var(--space-negative-1000);
  }

  .smMarginTop1000 {
    margin-top: var(--space-1000);
  }

  .smMarginBottom1000 {
    margin-bottom: var(--space-1000);
  }

  .smMarginTopN1000 {
    margin-top: var(--space-negative-1000);
  }

  .smMarginBottomN1000 {
    margin-bottom: var(--space-negative-1000);
  }

  .smPaddingY1000 {
    padding-bottom: var(--space-1000);
    padding-top: var(--space-1000);
  }

  .smPaddingX1000 {
    padding-left: var(--space-1000);
    padding-right: var(--space-1000);
  }

  html:not([dir="rtl"]) .smMarginStart1100 {
    margin-left: var(--space-1100);
  }

  html:not([dir="rtl"]) .smMarginEnd1100 {
    margin-right: var(--space-1100);
  }

  html[dir="rtl"] .smMarginStart1100 {
    margin-right: var(--space-1100);
  }

  html[dir="rtl"] .smMarginEnd1100 {
    margin-left: var(--space-1100);
  }

  html:not([dir="rtl"]) .smMarginStartN1100 {
    margin-left: var(--space-negative-1100);
  }

  html:not([dir="rtl"]) .smMarginEndN1100 {
    margin-right: var(--space-negative-1100);
  }

  html[dir="rtl"] .smMarginStartN1100 {
    margin-right: var(--space-negative-1100);
  }

  html[dir="rtl"] .smMarginEndN1100 {
    margin-left: var(--space-negative-1100);
  }

  .smMarginTop1100 {
    margin-top: var(--space-1100);
  }

  .smMarginBottom1100 {
    margin-bottom: var(--space-1100);
  }

  .smMarginTopN1100 {
    margin-top: var(--space-negative-1100);
  }

  .smMarginBottomN1100 {
    margin-bottom: var(--space-negative-1100);
  }

  .smPaddingY1100 {
    padding-bottom: var(--space-1100);
    padding-top: var(--space-1100);
  }

  .smPaddingX1100 {
    padding-left: var(--space-1100);
    padding-right: var(--space-1100);
  }

  html:not([dir="rtl"]) .smMarginStart1200 {
    margin-left: var(--space-1200);
  }

  html:not([dir="rtl"]) .smMarginEnd1200 {
    margin-right: var(--space-1200);
  }

  html[dir="rtl"] .smMarginStart1200 {
    margin-right: var(--space-1200);
  }

  html[dir="rtl"] .smMarginEnd1200 {
    margin-left: var(--space-1200);
  }

  html:not([dir="rtl"]) .smMarginStartN1200 {
    margin-left: var(--space-negative-1200);
  }

  html:not([dir="rtl"]) .smMarginEndN1200 {
    margin-right: var(--space-negative-1200);
  }

  html[dir="rtl"] .smMarginStartN1200 {
    margin-right: var(--space-negative-1200);
  }

  html[dir="rtl"] .smMarginEndN1200 {
    margin-left: var(--space-negative-1200);
  }

  .smMarginTop1200 {
    margin-top: var(--space-1200);
  }

  .smMarginBottom1200 {
    margin-bottom: var(--space-1200);
  }

  .smMarginTopN1200 {
    margin-top: var(--space-negative-1200);
  }

  .smMarginBottomN1200 {
    margin-bottom: var(--space-negative-1200);
  }

  .smPaddingY1200 {
    padding-bottom: var(--space-1200);
    padding-top: var(--space-1200);
  }

  .smPaddingX1200 {
    padding-left: var(--space-1200);
    padding-right: var(--space-1200);
  }

  html:not([dir="rtl"]) .smMarginStart1300 {
    margin-left: var(--space-1300);
  }

  html:not([dir="rtl"]) .smMarginEnd1300 {
    margin-right: var(--space-1300);
  }

  html[dir="rtl"] .smMarginStart1300 {
    margin-right: var(--space-1300);
  }

  html[dir="rtl"] .smMarginEnd1300 {
    margin-left: var(--space-1300);
  }

  html:not([dir="rtl"]) .smMarginStartN1300 {
    margin-left: var(--space-negative-1300);
  }

  html:not([dir="rtl"]) .smMarginEndN1300 {
    margin-right: var(--space-negative-1300);
  }

  html[dir="rtl"] .smMarginStartN1300 {
    margin-right: var(--space-negative-1300);
  }

  html[dir="rtl"] .smMarginEndN1300 {
    margin-left: var(--space-negative-1300);
  }

  .smMarginTop1300 {
    margin-top: var(--space-1300);
  }

  .smMarginBottom1300 {
    margin-bottom: var(--space-1300);
  }

  .smMarginTopN1300 {
    margin-top: var(--space-negative-1300);
  }

  .smMarginBottomN1300 {
    margin-bottom: var(--space-negative-1300);
  }

  .smPaddingY1300 {
    padding-bottom: var(--space-1300);
    padding-top: var(--space-1300);
  }

  .smPaddingX1300 {
    padding-left: var(--space-1300);
    padding-right: var(--space-1300);
  }

  html:not([dir="rtl"]) .smMarginStart1400 {
    margin-left: var(--space-1400);
  }

  html:not([dir="rtl"]) .smMarginEnd1400 {
    margin-right: var(--space-1400);
  }

  html[dir="rtl"] .smMarginStart1400 {
    margin-right: var(--space-1400);
  }

  html[dir="rtl"] .smMarginEnd1400 {
    margin-left: var(--space-1400);
  }

  html:not([dir="rtl"]) .smMarginStartN1400 {
    margin-left: var(--space-negative-1400);
  }

  html:not([dir="rtl"]) .smMarginEndN1400 {
    margin-right: var(--space-negative-1400);
  }

  html[dir="rtl"] .smMarginStartN1400 {
    margin-right: var(--space-negative-1400);
  }

  html[dir="rtl"] .smMarginEndN1400 {
    margin-left: var(--space-negative-1400);
  }

  .smMarginTop1400 {
    margin-top: var(--space-1400);
  }

  .smMarginBottom1400 {
    margin-bottom: var(--space-1400);
  }

  .smMarginTopN1400 {
    margin-top: var(--space-negative-1400);
  }

  .smMarginBottomN1400 {
    margin-bottom: var(--space-negative-1400);
  }

  .smPaddingY1400 {
    padding-bottom: var(--space-1400);
    padding-top: var(--space-1400);
  }

  .smPaddingX1400 {
    padding-left: var(--space-1400);
    padding-right: var(--space-1400);
  }

  html:not([dir="rtl"]) .smMarginStart1500 {
    margin-left: var(--space-1500);
  }

  html:not([dir="rtl"]) .smMarginEnd1500 {
    margin-right: var(--space-1500);
  }

  html[dir="rtl"] .smMarginStart1500 {
    margin-right: var(--space-1500);
  }

  html[dir="rtl"] .smMarginEnd1500 {
    margin-left: var(--space-1500);
  }

  html:not([dir="rtl"]) .smMarginStartN1500 {
    margin-left: var(--space-negative-1500);
  }

  html:not([dir="rtl"]) .smMarginEndN1500 {
    margin-right: var(--space-negative-1500);
  }

  html[dir="rtl"] .smMarginStartN1500 {
    margin-right: var(--space-negative-1500);
  }

  html[dir="rtl"] .smMarginEndN1500 {
    margin-left: var(--space-negative-1500);
  }

  .smMarginTop1500 {
    margin-top: var(--space-1500);
  }

  .smMarginBottom1500 {
    margin-bottom: var(--space-1500);
  }

  .smMarginTopN1500 {
    margin-top: var(--space-negative-1500);
  }

  .smMarginBottomN1500 {
    margin-bottom: var(--space-negative-1500);
  }

  .smPaddingY1500 {
    padding-bottom: var(--space-1500);
    padding-top: var(--space-1500);
  }

  .smPaddingX1500 {
    padding-left: var(--space-1500);
    padding-right: var(--space-1500);
  }

  html:not([dir="rtl"]) .smMarginStart1600 {
    margin-left: var(--space-1600);
  }

  html:not([dir="rtl"]) .smMarginEnd1600 {
    margin-right: var(--space-1600);
  }

  html[dir="rtl"] .smMarginStart1600 {
    margin-right: var(--space-1600);
  }

  html[dir="rtl"] .smMarginEnd1600 {
    margin-left: var(--space-1600);
  }

  html:not([dir="rtl"]) .smMarginStartN1600 {
    margin-left: var(--space-negative-1600);
  }

  html:not([dir="rtl"]) .smMarginEndN1600 {
    margin-right: var(--space-negative-1600);
  }

  html[dir="rtl"] .smMarginStartN1600 {
    margin-right: var(--space-negative-1600);
  }

  html[dir="rtl"] .smMarginEndN1600 {
    margin-left: var(--space-negative-1600);
  }

  .smMarginTop1600 {
    margin-top: var(--space-1600);
  }

  .smMarginBottom1600 {
    margin-bottom: var(--space-1600);
  }

  .smMarginTopN1600 {
    margin-top: var(--space-negative-1600);
  }

  .smMarginBottomN1600 {
    margin-bottom: var(--space-negative-1600);
  }

  .smPaddingY1600 {
    padding-bottom: var(--space-1600);
    padding-top: var(--space-1600);
  }

  .smPaddingX1600 {
    padding-left: var(--space-1600);
    padding-right: var(--space-1600);
  }

  html:not([dir="rtl"]) .smMarginStart200 {
    margin-left: var(--space-200);
  }

  html:not([dir="rtl"]) .smMarginEnd200 {
    margin-right: var(--space-200);
  }

  html[dir="rtl"] .smMarginStart200 {
    margin-right: var(--space-200);
  }

  html[dir="rtl"] .smMarginEnd200 {
    margin-left: var(--space-200);
  }

  html:not([dir="rtl"]) .smMarginStartN200 {
    margin-left: var(--space-negative-200);
  }

  html:not([dir="rtl"]) .smMarginEndN200 {
    margin-right: var(--space-negative-200);
  }

  html[dir="rtl"] .smMarginStartN200 {
    margin-right: var(--space-negative-200);
  }

  html[dir="rtl"] .smMarginEndN200 {
    margin-left: var(--space-negative-200);
  }

  .smMarginTop200 {
    margin-top: var(--space-200);
  }

  .smMarginBottom200 {
    margin-bottom: var(--space-200);
  }

  .smMarginTopN200 {
    margin-top: var(--space-negative-200);
  }

  .smMarginBottomN200 {
    margin-bottom: var(--space-negative-200);
  }

  .smPaddingY200 {
    padding-bottom: var(--space-200);
    padding-top: var(--space-200);
  }

  .smPaddingX200 {
    padding-left: var(--space-200);
    padding-right: var(--space-200);
  }

  html:not([dir="rtl"]) .smMarginStart300 {
    margin-left: var(--space-300);
  }

  html:not([dir="rtl"]) .smMarginEnd300 {
    margin-right: var(--space-300);
  }

  html[dir="rtl"] .smMarginStart300 {
    margin-right: var(--space-300);
  }

  html[dir="rtl"] .smMarginEnd300 {
    margin-left: var(--space-300);
  }

  html:not([dir="rtl"]) .smMarginStartN300 {
    margin-left: var(--space-negative-300);
  }

  html:not([dir="rtl"]) .smMarginEndN300 {
    margin-right: var(--space-negative-300);
  }

  html[dir="rtl"] .smMarginStartN300 {
    margin-right: var(--space-negative-300);
  }

  html[dir="rtl"] .smMarginEndN300 {
    margin-left: var(--space-negative-300);
  }

  .smMarginTop300 {
    margin-top: var(--space-300);
  }

  .smMarginBottom300 {
    margin-bottom: var(--space-300);
  }

  .smMarginTopN300 {
    margin-top: var(--space-negative-300);
  }

  .smMarginBottomN300 {
    margin-bottom: var(--space-negative-300);
  }

  .smPaddingY300 {
    padding-bottom: var(--space-300);
    padding-top: var(--space-300);
  }

  .smPaddingX300 {
    padding-left: var(--space-300);
    padding-right: var(--space-300);
  }

  html:not([dir="rtl"]) .smMarginStart400 {
    margin-left: var(--space-400);
  }

  html:not([dir="rtl"]) .smMarginEnd400 {
    margin-right: var(--space-400);
  }

  html[dir="rtl"] .smMarginStart400 {
    margin-right: var(--space-400);
  }

  html[dir="rtl"] .smMarginEnd400 {
    margin-left: var(--space-400);
  }

  html:not([dir="rtl"]) .smMarginStartN400 {
    margin-left: var(--space-negative-400);
  }

  html:not([dir="rtl"]) .smMarginEndN400 {
    margin-right: var(--space-negative-400);
  }

  html[dir="rtl"] .smMarginStartN400 {
    margin-right: var(--space-negative-400);
  }

  html[dir="rtl"] .smMarginEndN400 {
    margin-left: var(--space-negative-400);
  }

  .smMarginTop400 {
    margin-top: var(--space-400);
  }

  .smMarginBottom400 {
    margin-bottom: var(--space-400);
  }

  .smMarginTopN400 {
    margin-top: var(--space-negative-400);
  }

  .smMarginBottomN400 {
    margin-bottom: var(--space-negative-400);
  }

  .smPaddingY400 {
    padding-bottom: var(--space-400);
    padding-top: var(--space-400);
  }

  .smPaddingX400 {
    padding-left: var(--space-400);
    padding-right: var(--space-400);
  }

  html:not([dir="rtl"]) .smMarginStart500 {
    margin-left: var(--space-500);
  }

  html:not([dir="rtl"]) .smMarginEnd500 {
    margin-right: var(--space-500);
  }

  html[dir="rtl"] .smMarginStart500 {
    margin-right: var(--space-500);
  }

  html[dir="rtl"] .smMarginEnd500 {
    margin-left: var(--space-500);
  }

  html:not([dir="rtl"]) .smMarginStartN500 {
    margin-left: var(--space-negative-500);
  }

  html:not([dir="rtl"]) .smMarginEndN500 {
    margin-right: var(--space-negative-500);
  }

  html[dir="rtl"] .smMarginStartN500 {
    margin-right: var(--space-negative-500);
  }

  html[dir="rtl"] .smMarginEndN500 {
    margin-left: var(--space-negative-500);
  }

  .smMarginTop500 {
    margin-top: var(--space-500);
  }

  .smMarginBottom500 {
    margin-bottom: var(--space-500);
  }

  .smMarginTopN500 {
    margin-top: var(--space-negative-500);
  }

  .smMarginBottomN500 {
    margin-bottom: var(--space-negative-500);
  }

  .smPaddingY500 {
    padding-bottom: var(--space-500);
    padding-top: var(--space-500);
  }

  .smPaddingX500 {
    padding-left: var(--space-500);
    padding-right: var(--space-500);
  }

  html:not([dir="rtl"]) .smMarginStart600 {
    margin-left: var(--space-600);
  }

  html:not([dir="rtl"]) .smMarginEnd600 {
    margin-right: var(--space-600);
  }

  html[dir="rtl"] .smMarginStart600 {
    margin-right: var(--space-600);
  }

  html[dir="rtl"] .smMarginEnd600 {
    margin-left: var(--space-600);
  }

  html:not([dir="rtl"]) .smMarginStartN600 {
    margin-left: var(--space-negative-600);
  }

  html:not([dir="rtl"]) .smMarginEndN600 {
    margin-right: var(--space-negative-600);
  }

  html[dir="rtl"] .smMarginStartN600 {
    margin-right: var(--space-negative-600);
  }

  html[dir="rtl"] .smMarginEndN600 {
    margin-left: var(--space-negative-600);
  }

  .smMarginTop600 {
    margin-top: var(--space-600);
  }

  .smMarginBottom600 {
    margin-bottom: var(--space-600);
  }

  .smMarginTopN600 {
    margin-top: var(--space-negative-600);
  }

  .smMarginBottomN600 {
    margin-bottom: var(--space-negative-600);
  }

  .smPaddingY600 {
    padding-bottom: var(--space-600);
    padding-top: var(--space-600);
  }

  .smPaddingX600 {
    padding-left: var(--space-600);
    padding-right: var(--space-600);
  }

  html:not([dir="rtl"]) .smMarginStart700 {
    margin-left: var(--space-700);
  }

  html:not([dir="rtl"]) .smMarginEnd700 {
    margin-right: var(--space-700);
  }

  html[dir="rtl"] .smMarginStart700 {
    margin-right: var(--space-700);
  }

  html[dir="rtl"] .smMarginEnd700 {
    margin-left: var(--space-700);
  }

  html:not([dir="rtl"]) .smMarginStartN700 {
    margin-left: var(--space-negative-700);
  }

  html:not([dir="rtl"]) .smMarginEndN700 {
    margin-right: var(--space-negative-700);
  }

  html[dir="rtl"] .smMarginStartN700 {
    margin-right: var(--space-negative-700);
  }

  html[dir="rtl"] .smMarginEndN700 {
    margin-left: var(--space-negative-700);
  }

  .smMarginTop700 {
    margin-top: var(--space-700);
  }

  .smMarginBottom700 {
    margin-bottom: var(--space-700);
  }

  .smMarginTopN700 {
    margin-top: var(--space-negative-700);
  }

  .smMarginBottomN700 {
    margin-bottom: var(--space-negative-700);
  }

  .smPaddingY700 {
    padding-bottom: var(--space-700);
    padding-top: var(--space-700);
  }

  .smPaddingX700 {
    padding-left: var(--space-700);
    padding-right: var(--space-700);
  }

  html:not([dir="rtl"]) .smMarginStart800 {
    margin-left: var(--space-800);
  }

  html:not([dir="rtl"]) .smMarginEnd800 {
    margin-right: var(--space-800);
  }

  html[dir="rtl"] .smMarginStart800 {
    margin-right: var(--space-800);
  }

  html[dir="rtl"] .smMarginEnd800 {
    margin-left: var(--space-800);
  }

  html:not([dir="rtl"]) .smMarginStartN800 {
    margin-left: var(--space-negative-800);
  }

  html:not([dir="rtl"]) .smMarginEndN800 {
    margin-right: var(--space-negative-800);
  }

  html[dir="rtl"] .smMarginStartN800 {
    margin-right: var(--space-negative-800);
  }

  html[dir="rtl"] .smMarginEndN800 {
    margin-left: var(--space-negative-800);
  }

  .smMarginTop800 {
    margin-top: var(--space-800);
  }

  .smMarginBottom800 {
    margin-bottom: var(--space-800);
  }

  .smMarginTopN800 {
    margin-top: var(--space-negative-800);
  }

  .smMarginBottomN800 {
    margin-bottom: var(--space-negative-800);
  }

  .smPaddingY800 {
    padding-bottom: var(--space-800);
    padding-top: var(--space-800);
  }

  .smPaddingX800 {
    padding-left: var(--space-800);
    padding-right: var(--space-800);
  }

  html:not([dir="rtl"]) .smMarginStart900 {
    margin-left: var(--space-900);
  }

  html:not([dir="rtl"]) .smMarginEnd900 {
    margin-right: var(--space-900);
  }

  html[dir="rtl"] .smMarginStart900 {
    margin-right: var(--space-900);
  }

  html[dir="rtl"] .smMarginEnd900 {
    margin-left: var(--space-900);
  }

  html:not([dir="rtl"]) .smMarginStartN900 {
    margin-left: var(--space-negative-900);
  }

  html:not([dir="rtl"]) .smMarginEndN900 {
    margin-right: var(--space-negative-900);
  }

  html[dir="rtl"] .smMarginStartN900 {
    margin-right: var(--space-negative-900);
  }

  html[dir="rtl"] .smMarginEndN900 {
    margin-left: var(--space-negative-900);
  }

  .smMarginTop900 {
    margin-top: var(--space-900);
  }

  .smMarginBottom900 {
    margin-bottom: var(--space-900);
  }

  .smMarginTopN900 {
    margin-top: var(--space-negative-900);
  }

  .smMarginBottomN900 {
    margin-bottom: var(--space-negative-900);
  }

  .smPaddingY900 {
    padding-bottom: var(--space-900);
    padding-top: var(--space-900);
  }

  .smPaddingX900 {
    padding-left: var(--space-900);
    padding-right: var(--space-900);
  }
}

@media (--g-md) {
  html:not([dir="rtl"]) .mdMarginStartAuto {
    margin-left: auto;
  }

  html:not([dir="rtl"]) .mdMarginEndAuto {
    margin-right: auto;
  }

  html[dir="rtl"] .mdMarginStartAuto {
    margin-right: auto;
  }

  html[dir="rtl"] .mdMarginEndAuto {
    margin-left: auto;
  }

  .mdMarginTopAuto {
    margin-top: auto;
  }

  .mdMarginBottomAuto {
    margin-bottom: auto;
  }
}

@media (--g-md) {
  html:not([dir="rtl"]) .mdMarginStart0 {
    margin-left: var(--space-0);
  }

  html:not([dir="rtl"]) .mdMarginEnd0 {
    margin-right: var(--space-0);
  }

  html[dir="rtl"] .mdMarginStart0 {
    margin-right: var(--space-0);
  }

  html[dir="rtl"] .mdMarginEnd0 {
    margin-left: var(--space-0);
  }

  .mdMarginTop0 {
    margin-top: var(--space-0);
  }

  .mdMarginBottom0 {
    margin-bottom: var(--space-0);
  }

  .mdPaddingY0 {
    padding-bottom: var(--space-0);
    padding-top: var(--space-0);
  }

  .mdPaddingX0 {
    padding-left: var(--space-0);
    padding-right: var(--space-0);
  }

  html:not([dir="rtl"]) .mdMarginStart25 {
    margin-left: 1px;
  }

  html:not([dir="rtl"]) .mdMarginEnd25 {
    margin-right: 1px;
  }

  html[dir="rtl"] .mdMarginStart25 {
    margin-right: 1px;
  }

  html[dir="rtl"] .mdMarginEnd25 {
    margin-left: 1px;
  }

  html:not([dir="rtl"]) .mdMarginStartN25 {
    margin-left: -1px;
  }

  html:not([dir="rtl"]) .mdMarginEndN25 {
    margin-right: -1px;
  }

  html[dir="rtl"] .mdMarginStartN25 {
    margin-right: -1px;
  }

  html[dir="rtl"] .mdMarginEndN25 {
    margin-left: -1px;
  }

  .mdMarginTop25 {
    margin-top: 1px;
  }

  .mdMarginBottom25 {
    margin-bottom: 1px;
  }

  .mdMarginTopN25 {
    margin-top: -1px;
  }

  .mdMarginBottomN25 {
    margin-bottom: -1px;
  }

  .mdPaddingY25 {
    padding-bottom: 1px;
    padding-top: 1px;
  }

  .mdPaddingX25 {
    padding-left: 1px;
    padding-right: 1px;
  }

  html:not([dir="rtl"]) .mdMarginStart50 {
    margin-left: 2px;
  }

  html:not([dir="rtl"]) .mdMarginEnd50 {
    margin-right: 2px;
  }

  html[dir="rtl"] .mdMarginStart50 {
    margin-right: 2px;
  }

  html[dir="rtl"] .mdMarginEnd50 {
    margin-left: 2px;
  }

  html:not([dir="rtl"]) .mdMarginStartN50 {
    margin-left: -2px;
  }

  html:not([dir="rtl"]) .mdMarginEndN50 {
    margin-right: -2px;
  }

  html[dir="rtl"] .mdMarginStartN50 {
    margin-right: -2px;
  }

  html[dir="rtl"] .mdMarginEndN50 {
    margin-left: -2px;
  }

  .mdMarginTop50 {
    margin-top: 2px;
  }

  .mdMarginBottom50 {
    margin-bottom: 2px;
  }

  .mdMarginTopN50 {
    margin-top: -2px;
  }

  .mdMarginBottomN50 {
    margin-bottom: -2px;
  }

  .mdPaddingY50 {
    padding-bottom: 2px;
    padding-top: 2px;
  }

  .mdPaddingX50 {
    padding-left: 2px;
    padding-right: 2px;
  }

  html:not([dir="rtl"]) .mdMarginStart100 {
    margin-left: var(--space-100);
  }

  html:not([dir="rtl"]) .mdMarginEnd100 {
    margin-right: var(--space-100);
  }

  html[dir="rtl"] .mdMarginStart100 {
    margin-right: var(--space-100);
  }

  html[dir="rtl"] .mdMarginEnd100 {
    margin-left: var(--space-100);
  }

  html:not([dir="rtl"]) .mdMarginStartN100 {
    margin-left: var(--space-negative-100);
  }

  html:not([dir="rtl"]) .mdMarginEndN100 {
    margin-right: var(--space-negative-100);
  }

  html[dir="rtl"] .mdMarginStartN100 {
    margin-right: var(--space-negative-100);
  }

  html[dir="rtl"] .mdMarginEndN100 {
    margin-left: var(--space-negative-100);
  }

  .mdMarginTop100 {
    margin-top: var(--space-100);
  }

  .mdMarginBottom100 {
    margin-bottom: var(--space-100);
  }

  .mdMarginTopN100 {
    margin-top: var(--space-negative-100);
  }

  .mdMarginBottomN100 {
    margin-bottom: var(--space-negative-100);
  }

  .mdPaddingY100 {
    padding-bottom: var(--space-100);
    padding-top: var(--space-100);
  }

  .mdPaddingX100 {
    padding-left: var(--space-100);
    padding-right: var(--space-100);
  }

  html:not([dir="rtl"]) .mdMarginStart150 {
    margin-left: 6px;
  }

  html:not([dir="rtl"]) .mdMarginEnd150 {
    margin-right: 6px;
  }

  html[dir="rtl"] .mdMarginStart150 {
    margin-right: 6px;
  }

  html[dir="rtl"] .mdMarginEnd150 {
    margin-left: 6px;
  }

  html:not([dir="rtl"]) .mdMarginStartN150 {
    margin-left: -6px;
  }

  html:not([dir="rtl"]) .mdMarginEndN150 {
    margin-right: -6px;
  }

  html[dir="rtl"] .mdMarginStartN150 {
    margin-right: -6px;
  }

  html[dir="rtl"] .mdMarginEndN150 {
    margin-left: -6px;
  }

  .mdMarginTop150 {
    margin-top: 6px;
  }

  .mdMarginBottom150 {
    margin-bottom: 6px;
  }

  .mdMarginTopN150 {
    margin-top: -6px;
  }

  .mdMarginBottomN150 {
    margin-bottom: -6px;
  }

  .mdPaddingY150 {
    padding-bottom: 6px;
    padding-top: 6px;
  }

  .mdPaddingX150 {
    padding-left: 6px;
    padding-right: 6px;
  }

  html:not([dir="rtl"]) .mdMarginStart1000 {
    margin-left: var(--space-1000);
  }

  html:not([dir="rtl"]) .mdMarginEnd1000 {
    margin-right: var(--space-1000);
  }

  html[dir="rtl"] .mdMarginStart1000 {
    margin-right: var(--space-1000);
  }

  html[dir="rtl"] .mdMarginEnd1000 {
    margin-left: var(--space-1000);
  }

  html:not([dir="rtl"]) .mdMarginStartN1000 {
    margin-left: var(--space-negative-1000);
  }

  html:not([dir="rtl"]) .mdMarginEndN1000 {
    margin-right: var(--space-negative-1000);
  }

  html[dir="rtl"] .mdMarginStartN1000 {
    margin-right: var(--space-negative-1000);
  }

  html[dir="rtl"] .mdMarginEndN1000 {
    margin-left: var(--space-negative-1000);
  }

  .mdMarginTop1000 {
    margin-top: var(--space-1000);
  }

  .mdMarginBottom1000 {
    margin-bottom: var(--space-1000);
  }

  .mdMarginTopN1000 {
    margin-top: var(--space-negative-1000);
  }

  .mdMarginBottomN1000 {
    margin-bottom: var(--space-negative-1000);
  }

  .mdPaddingY1000 {
    padding-bottom: var(--space-1000);
    padding-top: var(--space-1000);
  }

  .mdPaddingX1000 {
    padding-left: var(--space-1000);
    padding-right: var(--space-1000);
  }

  html:not([dir="rtl"]) .mdMarginStart1100 {
    margin-left: var(--space-1100);
  }

  html:not([dir="rtl"]) .mdMarginEnd1100 {
    margin-right: var(--space-1100);
  }

  html[dir="rtl"] .mdMarginStart1100 {
    margin-right: var(--space-1100);
  }

  html[dir="rtl"] .mdMarginEnd1100 {
    margin-left: var(--space-1100);
  }

  html:not([dir="rtl"]) .mdMarginStartN1100 {
    margin-left: var(--space-negative-1100);
  }

  html:not([dir="rtl"]) .mdMarginEndN1100 {
    margin-right: var(--space-negative-1100);
  }

  html[dir="rtl"] .mdMarginStartN1100 {
    margin-right: var(--space-negative-1100);
  }

  html[dir="rtl"] .mdMarginEndN1100 {
    margin-left: var(--space-negative-1100);
  }

  .mdMarginTop1100 {
    margin-top: var(--space-1100);
  }

  .mdMarginBottom1100 {
    margin-bottom: var(--space-1100);
  }

  .mdMarginTopN1100 {
    margin-top: var(--space-negative-1100);
  }

  .mdMarginBottomN1100 {
    margin-bottom: var(--space-negative-1100);
  }

  .mdPaddingY1100 {
    padding-bottom: var(--space-1100);
    padding-top: var(--space-1100);
  }

  .mdPaddingX1100 {
    padding-left: var(--space-1100);
    padding-right: var(--space-1100);
  }

  html:not([dir="rtl"]) .mdMarginStart1200 {
    margin-left: var(--space-1200);
  }

  html:not([dir="rtl"]) .mdMarginEnd1200 {
    margin-right: var(--space-1200);
  }

  html[dir="rtl"] .mdMarginStart1200 {
    margin-right: var(--space-1200);
  }

  html[dir="rtl"] .mdMarginEnd1200 {
    margin-left: var(--space-1200);
  }

  html:not([dir="rtl"]) .mdMarginStartN1200 {
    margin-left: var(--space-negative-1200);
  }

  html:not([dir="rtl"]) .mdMarginEndN1200 {
    margin-right: var(--space-negative-1200);
  }

  html[dir="rtl"] .mdMarginStartN1200 {
    margin-right: var(--space-negative-1200);
  }

  html[dir="rtl"] .mdMarginEndN1200 {
    margin-left: var(--space-negative-1200);
  }

  .mdMarginTop1200 {
    margin-top: var(--space-1200);
  }

  .mdMarginBottom1200 {
    margin-bottom: var(--space-1200);
  }

  .mdMarginTopN1200 {
    margin-top: var(--space-negative-1200);
  }

  .mdMarginBottomN1200 {
    margin-bottom: var(--space-negative-1200);
  }

  .mdPaddingY1200 {
    padding-bottom: var(--space-1200);
    padding-top: var(--space-1200);
  }

  .mdPaddingX1200 {
    padding-left: var(--space-1200);
    padding-right: var(--space-1200);
  }

  html:not([dir="rtl"]) .mdMarginStart1300 {
    margin-left: var(--space-1300);
  }

  html:not([dir="rtl"]) .mdMarginEnd1300 {
    margin-right: var(--space-1300);
  }

  html[dir="rtl"] .mdMarginStart1300 {
    margin-right: var(--space-1300);
  }

  html[dir="rtl"] .mdMarginEnd1300 {
    margin-left: var(--space-1300);
  }

  html:not([dir="rtl"]) .mdMarginStartN1300 {
    margin-left: var(--space-negative-1300);
  }

  html:not([dir="rtl"]) .mdMarginEndN1300 {
    margin-right: var(--space-negative-1300);
  }

  html[dir="rtl"] .mdMarginStartN1300 {
    margin-right: var(--space-negative-1300);
  }

  html[dir="rtl"] .mdMarginEndN1300 {
    margin-left: var(--space-negative-1300);
  }

  .mdMarginTop1300 {
    margin-top: var(--space-1300);
  }

  .mdMarginBottom1300 {
    margin-bottom: var(--space-1300);
  }

  .mdMarginTopN1300 {
    margin-top: var(--space-negative-1300);
  }

  .mdMarginBottomN1300 {
    margin-bottom: var(--space-negative-1300);
  }

  .mdPaddingY1300 {
    padding-bottom: var(--space-1300);
    padding-top: var(--space-1300);
  }

  .mdPaddingX1300 {
    padding-left: var(--space-1300);
    padding-right: var(--space-1300);
  }

  html:not([dir="rtl"]) .mdMarginStart1400 {
    margin-left: var(--space-1400);
  }

  html:not([dir="rtl"]) .mdMarginEnd1400 {
    margin-right: var(--space-1400);
  }

  html[dir="rtl"] .mdMarginStart1400 {
    margin-right: var(--space-1400);
  }

  html[dir="rtl"] .mdMarginEnd1400 {
    margin-left: var(--space-1400);
  }

  html:not([dir="rtl"]) .mdMarginStartN1400 {
    margin-left: var(--space-negative-1400);
  }

  html:not([dir="rtl"]) .mdMarginEndN1400 {
    margin-right: var(--space-negative-1400);
  }

  html[dir="rtl"] .mdMarginStartN1400 {
    margin-right: var(--space-negative-1400);
  }

  html[dir="rtl"] .mdMarginEndN1400 {
    margin-left: var(--space-negative-1400);
  }

  .mdMarginTop1400 {
    margin-top: var(--space-1400);
  }

  .mdMarginBottom1400 {
    margin-bottom: var(--space-1400);
  }

  .mdMarginTopN1400 {
    margin-top: var(--space-negative-1400);
  }

  .mdMarginBottomN1400 {
    margin-bottom: var(--space-negative-1400);
  }

  .mdPaddingY1400 {
    padding-bottom: var(--space-1400);
    padding-top: var(--space-1400);
  }

  .mdPaddingX1400 {
    padding-left: var(--space-1400);
    padding-right: var(--space-1400);
  }

  html:not([dir="rtl"]) .mdMarginStart1500 {
    margin-left: var(--space-1500);
  }

  html:not([dir="rtl"]) .mdMarginEnd1500 {
    margin-right: var(--space-1500);
  }

  html[dir="rtl"] .mdMarginStart1500 {
    margin-right: var(--space-1500);
  }

  html[dir="rtl"] .mdMarginEnd1500 {
    margin-left: var(--space-1500);
  }

  html:not([dir="rtl"]) .mdMarginStartN1500 {
    margin-left: var(--space-negative-1500);
  }

  html:not([dir="rtl"]) .mdMarginEndN1500 {
    margin-right: var(--space-negative-1500);
  }

  html[dir="rtl"] .mdMarginStartN1500 {
    margin-right: var(--space-negative-1500);
  }

  html[dir="rtl"] .mdMarginEndN1500 {
    margin-left: var(--space-negative-1500);
  }

  .mdMarginTop1500 {
    margin-top: var(--space-1500);
  }

  .mdMarginBottom1500 {
    margin-bottom: var(--space-1500);
  }

  .mdMarginTopN1500 {
    margin-top: var(--space-negative-1500);
  }

  .mdMarginBottomN1500 {
    margin-bottom: var(--space-negative-1500);
  }

  .mdPaddingY1500 {
    padding-bottom: var(--space-1500);
    padding-top: var(--space-1500);
  }

  .mdPaddingX1500 {
    padding-left: var(--space-1500);
    padding-right: var(--space-1500);
  }

  html:not([dir="rtl"]) .mdMarginStart1600 {
    margin-left: var(--space-1600);
  }

  html:not([dir="rtl"]) .mdMarginEnd1600 {
    margin-right: var(--space-1600);
  }

  html[dir="rtl"] .mdMarginStart1600 {
    margin-right: var(--space-1600);
  }

  html[dir="rtl"] .mdMarginEnd1600 {
    margin-left: var(--space-1600);
  }

  html:not([dir="rtl"]) .mdMarginStartN1600 {
    margin-left: var(--space-negative-1600);
  }

  html:not([dir="rtl"]) .mdMarginEndN1600 {
    margin-right: var(--space-negative-1600);
  }

  html[dir="rtl"] .mdMarginStartN1600 {
    margin-right: var(--space-negative-1600);
  }

  html[dir="rtl"] .mdMarginEndN1600 {
    margin-left: var(--space-negative-1600);
  }

  .mdMarginTop1600 {
    margin-top: var(--space-1600);
  }

  .mdMarginBottom1600 {
    margin-bottom: var(--space-1600);
  }

  .mdMarginTopN1600 {
    margin-top: var(--space-negative-1600);
  }

  .mdMarginBottomN1600 {
    margin-bottom: var(--space-negative-1600);
  }

  .mdPaddingY1600 {
    padding-bottom: var(--space-1600);
    padding-top: var(--space-1600);
  }

  .mdPaddingX1600 {
    padding-left: var(--space-1600);
    padding-right: var(--space-1600);
  }

  html:not([dir="rtl"]) .mdMarginStart200 {
    margin-left: var(--space-200);
  }

  html:not([dir="rtl"]) .mdMarginEnd200 {
    margin-right: var(--space-200);
  }

  html[dir="rtl"] .mdMarginStart200 {
    margin-right: var(--space-200);
  }

  html[dir="rtl"] .mdMarginEnd200 {
    margin-left: var(--space-200);
  }

  html:not([dir="rtl"]) .mdMarginStartN200 {
    margin-left: var(--space-negative-200);
  }

  html:not([dir="rtl"]) .mdMarginEndN200 {
    margin-right: var(--space-negative-200);
  }

  html[dir="rtl"] .mdMarginStartN200 {
    margin-right: var(--space-negative-200);
  }

  html[dir="rtl"] .mdMarginEndN200 {
    margin-left: var(--space-negative-200);
  }

  .mdMarginTop200 {
    margin-top: var(--space-200);
  }

  .mdMarginBottom200 {
    margin-bottom: var(--space-200);
  }

  .mdMarginTopN200 {
    margin-top: var(--space-negative-200);
  }

  .mdMarginBottomN200 {
    margin-bottom: var(--space-negative-200);
  }

  .mdPaddingY200 {
    padding-bottom: var(--space-200);
    padding-top: var(--space-200);
  }

  .mdPaddingX200 {
    padding-left: var(--space-200);
    padding-right: var(--space-200);
  }

  html:not([dir="rtl"]) .mdMarginStart300 {
    margin-left: var(--space-300);
  }

  html:not([dir="rtl"]) .mdMarginEnd300 {
    margin-right: var(--space-300);
  }

  html[dir="rtl"] .mdMarginStart300 {
    margin-right: var(--space-300);
  }

  html[dir="rtl"] .mdMarginEnd300 {
    margin-left: var(--space-300);
  }

  html:not([dir="rtl"]) .mdMarginStartN300 {
    margin-left: var(--space-negative-300);
  }

  html:not([dir="rtl"]) .mdMarginEndN300 {
    margin-right: var(--space-negative-300);
  }

  html[dir="rtl"] .mdMarginStartN300 {
    margin-right: var(--space-negative-300);
  }

  html[dir="rtl"] .mdMarginEndN300 {
    margin-left: var(--space-negative-300);
  }

  .mdMarginTop300 {
    margin-top: var(--space-300);
  }

  .mdMarginBottom300 {
    margin-bottom: var(--space-300);
  }

  .mdMarginTopN300 {
    margin-top: var(--space-negative-300);
  }

  .mdMarginBottomN300 {
    margin-bottom: var(--space-negative-300);
  }

  .mdPaddingY300 {
    padding-bottom: var(--space-300);
    padding-top: var(--space-300);
  }

  .mdPaddingX300 {
    padding-left: var(--space-300);
    padding-right: var(--space-300);
  }

  html:not([dir="rtl"]) .mdMarginStart400 {
    margin-left: var(--space-400);
  }

  html:not([dir="rtl"]) .mdMarginEnd400 {
    margin-right: var(--space-400);
  }

  html[dir="rtl"] .mdMarginStart400 {
    margin-right: var(--space-400);
  }

  html[dir="rtl"] .mdMarginEnd400 {
    margin-left: var(--space-400);
  }

  html:not([dir="rtl"]) .mdMarginStartN400 {
    margin-left: var(--space-negative-400);
  }

  html:not([dir="rtl"]) .mdMarginEndN400 {
    margin-right: var(--space-negative-400);
  }

  html[dir="rtl"] .mdMarginStartN400 {
    margin-right: var(--space-negative-400);
  }

  html[dir="rtl"] .mdMarginEndN400 {
    margin-left: var(--space-negative-400);
  }

  .mdMarginTop400 {
    margin-top: var(--space-400);
  }

  .mdMarginBottom400 {
    margin-bottom: var(--space-400);
  }

  .mdMarginTopN400 {
    margin-top: var(--space-negative-400);
  }

  .mdMarginBottomN400 {
    margin-bottom: var(--space-negative-400);
  }

  .mdPaddingY400 {
    padding-bottom: var(--space-400);
    padding-top: var(--space-400);
  }

  .mdPaddingX400 {
    padding-left: var(--space-400);
    padding-right: var(--space-400);
  }

  html:not([dir="rtl"]) .mdMarginStart500 {
    margin-left: var(--space-500);
  }

  html:not([dir="rtl"]) .mdMarginEnd500 {
    margin-right: var(--space-500);
  }

  html[dir="rtl"] .mdMarginStart500 {
    margin-right: var(--space-500);
  }

  html[dir="rtl"] .mdMarginEnd500 {
    margin-left: var(--space-500);
  }

  html:not([dir="rtl"]) .mdMarginStartN500 {
    margin-left: var(--space-negative-500);
  }

  html:not([dir="rtl"]) .mdMarginEndN500 {
    margin-right: var(--space-negative-500);
  }

  html[dir="rtl"] .mdMarginStartN500 {
    margin-right: var(--space-negative-500);
  }

  html[dir="rtl"] .mdMarginEndN500 {
    margin-left: var(--space-negative-500);
  }

  .mdMarginTop500 {
    margin-top: var(--space-500);
  }

  .mdMarginBottom500 {
    margin-bottom: var(--space-500);
  }

  .mdMarginTopN500 {
    margin-top: var(--space-negative-500);
  }

  .mdMarginBottomN500 {
    margin-bottom: var(--space-negative-500);
  }

  .mdPaddingY500 {
    padding-bottom: var(--space-500);
    padding-top: var(--space-500);
  }

  .mdPaddingX500 {
    padding-left: var(--space-500);
    padding-right: var(--space-500);
  }

  html:not([dir="rtl"]) .mdMarginStart600 {
    margin-left: var(--space-600);
  }

  html:not([dir="rtl"]) .mdMarginEnd600 {
    margin-right: var(--space-600);
  }

  html[dir="rtl"] .mdMarginStart600 {
    margin-right: var(--space-600);
  }

  html[dir="rtl"] .mdMarginEnd600 {
    margin-left: var(--space-600);
  }

  html:not([dir="rtl"]) .mdMarginStartN600 {
    margin-left: var(--space-negative-600);
  }

  html:not([dir="rtl"]) .mdMarginEndN600 {
    margin-right: var(--space-negative-600);
  }

  html[dir="rtl"] .mdMarginStartN600 {
    margin-right: var(--space-negative-600);
  }

  html[dir="rtl"] .mdMarginEndN600 {
    margin-left: var(--space-negative-600);
  }

  .mdMarginTop600 {
    margin-top: var(--space-600);
  }

  .mdMarginBottom600 {
    margin-bottom: var(--space-600);
  }

  .mdMarginTopN600 {
    margin-top: var(--space-negative-600);
  }

  .mdMarginBottomN600 {
    margin-bottom: var(--space-negative-600);
  }

  .mdPaddingY600 {
    padding-bottom: var(--space-600);
    padding-top: var(--space-600);
  }

  .mdPaddingX600 {
    padding-left: var(--space-600);
    padding-right: var(--space-600);
  }

  html:not([dir="rtl"]) .mdMarginStart700 {
    margin-left: var(--space-700);
  }

  html:not([dir="rtl"]) .mdMarginEnd700 {
    margin-right: var(--space-700);
  }

  html[dir="rtl"] .mdMarginStart700 {
    margin-right: var(--space-700);
  }

  html[dir="rtl"] .mdMarginEnd700 {
    margin-left: var(--space-700);
  }

  html:not([dir="rtl"]) .mdMarginStartN700 {
    margin-left: var(--space-negative-700);
  }

  html:not([dir="rtl"]) .mdMarginEndN700 {
    margin-right: var(--space-negative-700);
  }

  html[dir="rtl"] .mdMarginStartN700 {
    margin-right: var(--space-negative-700);
  }

  html[dir="rtl"] .mdMarginEndN700 {
    margin-left: var(--space-negative-700);
  }

  .mdMarginTop700 {
    margin-top: var(--space-700);
  }

  .mdMarginBottom700 {
    margin-bottom: var(--space-700);
  }

  .mdMarginTopN700 {
    margin-top: var(--space-negative-700);
  }

  .mdMarginBottomN700 {
    margin-bottom: var(--space-negative-700);
  }

  .mdPaddingY700 {
    padding-bottom: var(--space-700);
    padding-top: var(--space-700);
  }

  .mdPaddingX700 {
    padding-left: var(--space-700);
    padding-right: var(--space-700);
  }

  html:not([dir="rtl"]) .mdMarginStart800 {
    margin-left: var(--space-800);
  }

  html:not([dir="rtl"]) .mdMarginEnd800 {
    margin-right: var(--space-800);
  }

  html[dir="rtl"] .mdMarginStart800 {
    margin-right: var(--space-800);
  }

  html[dir="rtl"] .mdMarginEnd800 {
    margin-left: var(--space-800);
  }

  html:not([dir="rtl"]) .mdMarginStartN800 {
    margin-left: var(--space-negative-800);
  }

  html:not([dir="rtl"]) .mdMarginEndN800 {
    margin-right: var(--space-negative-800);
  }

  html[dir="rtl"] .mdMarginStartN800 {
    margin-right: var(--space-negative-800);
  }

  html[dir="rtl"] .mdMarginEndN800 {
    margin-left: var(--space-negative-800);
  }

  .mdMarginTop800 {
    margin-top: var(--space-800);
  }

  .mdMarginBottom800 {
    margin-bottom: var(--space-800);
  }

  .mdMarginTopN800 {
    margin-top: var(--space-negative-800);
  }

  .mdMarginBottomN800 {
    margin-bottom: var(--space-negative-800);
  }

  .mdPaddingY800 {
    padding-bottom: var(--space-800);
    padding-top: var(--space-800);
  }

  .mdPaddingX800 {
    padding-left: var(--space-800);
    padding-right: var(--space-800);
  }

  html:not([dir="rtl"]) .mdMarginStart900 {
    margin-left: var(--space-900);
  }

  html:not([dir="rtl"]) .mdMarginEnd900 {
    margin-right: var(--space-900);
  }

  html[dir="rtl"] .mdMarginStart900 {
    margin-right: var(--space-900);
  }

  html[dir="rtl"] .mdMarginEnd900 {
    margin-left: var(--space-900);
  }

  html:not([dir="rtl"]) .mdMarginStartN900 {
    margin-left: var(--space-negative-900);
  }

  html:not([dir="rtl"]) .mdMarginEndN900 {
    margin-right: var(--space-negative-900);
  }

  html[dir="rtl"] .mdMarginStartN900 {
    margin-right: var(--space-negative-900);
  }

  html[dir="rtl"] .mdMarginEndN900 {
    margin-left: var(--space-negative-900);
  }

  .mdMarginTop900 {
    margin-top: var(--space-900);
  }

  .mdMarginBottom900 {
    margin-bottom: var(--space-900);
  }

  .mdMarginTopN900 {
    margin-top: var(--space-negative-900);
  }

  .mdMarginBottomN900 {
    margin-bottom: var(--space-negative-900);
  }

  .mdPaddingY900 {
    padding-bottom: var(--space-900);
    padding-top: var(--space-900);
  }

  .mdPaddingX900 {
    padding-left: var(--space-900);
    padding-right: var(--space-900);
  }
}

@media (--g-lg) {
  html:not([dir="rtl"]) .lgMarginStartAuto {
    margin-left: auto;
  }

  html:not([dir="rtl"]) .lgMarginEndAuto {
    margin-right: auto;
  }

  html[dir="rtl"] .lgMarginStartAuto {
    margin-right: auto;
  }

  html[dir="rtl"] .lgMarginEndAuto {
    margin-left: auto;
  }

  .lgMarginTopAuto {
    margin-top: auto;
  }

  .lgMarginBottomAuto {
    margin-bottom: auto;
  }
}

@media (--g-lg) {
  html:not([dir="rtl"]) .lgMarginStart0 {
    margin-left: var(--space-0);
  }

  html:not([dir="rtl"]) .lgMarginEnd0 {
    margin-right: var(--space-0);
  }

  html[dir="rtl"] .lgMarginStart0 {
    margin-right: var(--space-0);
  }

  html[dir="rtl"] .lgMarginEnd0 {
    margin-left: var(--space-0);
  }

  .lgMarginTop0 {
    margin-top: var(--space-0);
  }

  .lgMarginBottom0 {
    margin-bottom: var(--space-0);
  }

  .lgPaddingY0 {
    padding-bottom: var(--space-0);
    padding-top: var(--space-0);
  }

  .lgPaddingX0 {
    padding-left: var(--space-0);
    padding-right: var(--space-0);
  }

  html:not([dir="rtl"]) .lgMarginStart25 {
    margin-left: 1px;
  }

  html:not([dir="rtl"]) .lgMarginEnd25 {
    margin-right: 1px;
  }

  html[dir="rtl"] .lgMarginStart25 {
    margin-right: 1px;
  }

  html[dir="rtl"] .lgMarginEnd25 {
    margin-left: 1px;
  }

  html:not([dir="rtl"]) .lgMarginStartN25 {
    margin-left: -1px;
  }

  html:not([dir="rtl"]) .lgMarginEndN25 {
    margin-right: -1px;
  }

  html[dir="rtl"] .lgMarginStartN25 {
    margin-right: -1px;
  }

  html[dir="rtl"] .lgMarginEndN25 {
    margin-left: -1px;
  }

  .lgMarginTop25 {
    margin-top: 1px;
  }

  .lgMarginBottom25 {
    margin-bottom: 1px;
  }

  .lgMarginTopN25 {
    margin-top: -1px;
  }

  .lgMarginBottomN25 {
    margin-bottom: -1px;
  }

  .lgPaddingY25 {
    padding-bottom: 1px;
    padding-top: 1px;
  }

  .lgPaddingX25 {
    padding-left: 1px;
    padding-right: 1px;
  }

  html:not([dir="rtl"]) .lgMarginStart50 {
    margin-left: 2px;
  }

  html:not([dir="rtl"]) .lgMarginEnd50 {
    margin-right: 2px;
  }

  html[dir="rtl"] .lgMarginStart50 {
    margin-right: 2px;
  }

  html[dir="rtl"] .lgMarginEnd50 {
    margin-left: 2px;
  }

  html:not([dir="rtl"]) .lgMarginStartN50 {
    margin-left: -2px;
  }

  html:not([dir="rtl"]) .lgMarginEndN50 {
    margin-right: -2px;
  }

  html[dir="rtl"] .lgMarginStartN50 {
    margin-right: -2px;
  }

  html[dir="rtl"] .lgMarginEndN50 {
    margin-left: -2px;
  }

  .lgMarginTop50 {
    margin-top: 2px;
  }

  .lgMarginBottom50 {
    margin-bottom: 2px;
  }

  .lgMarginTopN50 {
    margin-top: -2px;
  }

  .lgMarginBottomN50 {
    margin-bottom: -2px;
  }

  .lgPaddingY50 {
    padding-bottom: 2px;
    padding-top: 2px;
  }

  .lgPaddingX50 {
    padding-left: 2px;
    padding-right: 2px;
  }

  html:not([dir="rtl"]) .lgMarginStart100 {
    margin-left: var(--space-100);
  }

  html:not([dir="rtl"]) .lgMarginEnd100 {
    margin-right: var(--space-100);
  }

  html[dir="rtl"] .lgMarginStart100 {
    margin-right: var(--space-100);
  }

  html[dir="rtl"] .lgMarginEnd100 {
    margin-left: var(--space-100);
  }

  html:not([dir="rtl"]) .lgMarginStartN100 {
    margin-left: var(--space-negative-100);
  }

  html:not([dir="rtl"]) .lgMarginEndN100 {
    margin-right: var(--space-negative-100);
  }

  html[dir="rtl"] .lgMarginStartN100 {
    margin-right: var(--space-negative-100);
  }

  html[dir="rtl"] .lgMarginEndN100 {
    margin-left: var(--space-negative-100);
  }

  .lgMarginTop100 {
    margin-top: var(--space-100);
  }

  .lgMarginBottom100 {
    margin-bottom: var(--space-100);
  }

  .lgMarginTopN100 {
    margin-top: var(--space-negative-100);
  }

  .lgMarginBottomN100 {
    margin-bottom: var(--space-negative-100);
  }

  .lgPaddingY100 {
    padding-bottom: var(--space-100);
    padding-top: var(--space-100);
  }

  .lgPaddingX100 {
    padding-left: var(--space-100);
    padding-right: var(--space-100);
  }

  html:not([dir="rtl"]) .lgMarginStart150 {
    margin-left: 6px;
  }

  html:not([dir="rtl"]) .lgMarginEnd150 {
    margin-right: 6px;
  }

  html[dir="rtl"] .lgMarginStart150 {
    margin-right: 6px;
  }

  html[dir="rtl"] .lgMarginEnd150 {
    margin-left: 6px;
  }

  html:not([dir="rtl"]) .lgMarginStartN150 {
    margin-left: -6px;
  }

  html:not([dir="rtl"]) .lgMarginEndN150 {
    margin-right: -6px;
  }

  html[dir="rtl"] .lgMarginStartN150 {
    margin-right: -6px;
  }

  html[dir="rtl"] .lgMarginEndN150 {
    margin-left: -6px;
  }

  .lgMarginTop150 {
    margin-top: 6px;
  }

  .lgMarginBottom150 {
    margin-bottom: 6px;
  }

  .lgMarginTopN150 {
    margin-top: -6px;
  }

  .lgMarginBottomN150 {
    margin-bottom: -6px;
  }

  .lgPaddingY150 {
    padding-bottom: 6px;
    padding-top: 6px;
  }

  .lgPaddingX150 {
    padding-left: 6px;
    padding-right: 6px;
  }

  html:not([dir="rtl"]) .lgMarginStart1000 {
    margin-left: var(--space-1000);
  }

  html:not([dir="rtl"]) .lgMarginEnd1000 {
    margin-right: var(--space-1000);
  }

  html[dir="rtl"] .lgMarginStart1000 {
    margin-right: var(--space-1000);
  }

  html[dir="rtl"] .lgMarginEnd1000 {
    margin-left: var(--space-1000);
  }

  html:not([dir="rtl"]) .lgMarginStartN1000 {
    margin-left: var(--space-negative-1000);
  }

  html:not([dir="rtl"]) .lgMarginEndN1000 {
    margin-right: var(--space-negative-1000);
  }

  html[dir="rtl"] .lgMarginStartN1000 {
    margin-right: var(--space-negative-1000);
  }

  html[dir="rtl"] .lgMarginEndN1000 {
    margin-left: var(--space-negative-1000);
  }

  .lgMarginTop1000 {
    margin-top: var(--space-1000);
  }

  .lgMarginBottom1000 {
    margin-bottom: var(--space-1000);
  }

  .lgMarginTopN1000 {
    margin-top: var(--space-negative-1000);
  }

  .lgMarginBottomN1000 {
    margin-bottom: var(--space-negative-1000);
  }

  .lgPaddingY1000 {
    padding-bottom: var(--space-1000);
    padding-top: var(--space-1000);
  }

  .lgPaddingX1000 {
    padding-left: var(--space-1000);
    padding-right: var(--space-1000);
  }

  html:not([dir="rtl"]) .lgMarginStart1100 {
    margin-left: var(--space-1100);
  }

  html:not([dir="rtl"]) .lgMarginEnd1100 {
    margin-right: var(--space-1100);
  }

  html[dir="rtl"] .lgMarginStart1100 {
    margin-right: var(--space-1100);
  }

  html[dir="rtl"] .lgMarginEnd1100 {
    margin-left: var(--space-1100);
  }

  html:not([dir="rtl"]) .lgMarginStartN1100 {
    margin-left: var(--space-negative-1100);
  }

  html:not([dir="rtl"]) .lgMarginEndN1100 {
    margin-right: var(--space-negative-1100);
  }

  html[dir="rtl"] .lgMarginStartN1100 {
    margin-right: var(--space-negative-1100);
  }

  html[dir="rtl"] .lgMarginEndN1100 {
    margin-left: var(--space-negative-1100);
  }

  .lgMarginTop1100 {
    margin-top: var(--space-1100);
  }

  .lgMarginBottom1100 {
    margin-bottom: var(--space-1100);
  }

  .lgMarginTopN1100 {
    margin-top: var(--space-negative-1100);
  }

  .lgMarginBottomN1100 {
    margin-bottom: var(--space-negative-1100);
  }

  .lgPaddingY1100 {
    padding-bottom: var(--space-1100);
    padding-top: var(--space-1100);
  }

  .lgPaddingX1100 {
    padding-left: var(--space-1100);
    padding-right: var(--space-1100);
  }

  html:not([dir="rtl"]) .lgMarginStart1200 {
    margin-left: var(--space-1200);
  }

  html:not([dir="rtl"]) .lgMarginEnd1200 {
    margin-right: var(--space-1200);
  }

  html[dir="rtl"] .lgMarginStart1200 {
    margin-right: var(--space-1200);
  }

  html[dir="rtl"] .lgMarginEnd1200 {
    margin-left: var(--space-1200);
  }

  html:not([dir="rtl"]) .lgMarginStartN1200 {
    margin-left: var(--space-negative-1200);
  }

  html:not([dir="rtl"]) .lgMarginEndN1200 {
    margin-right: var(--space-negative-1200);
  }

  html[dir="rtl"] .lgMarginStartN1200 {
    margin-right: var(--space-negative-1200);
  }

  html[dir="rtl"] .lgMarginEndN1200 {
    margin-left: var(--space-negative-1200);
  }

  .lgMarginTop1200 {
    margin-top: var(--space-1200);
  }

  .lgMarginBottom1200 {
    margin-bottom: var(--space-1200);
  }

  .lgMarginTopN1200 {
    margin-top: var(--space-negative-1200);
  }

  .lgMarginBottomN1200 {
    margin-bottom: var(--space-negative-1200);
  }

  .lgPaddingY1200 {
    padding-bottom: var(--space-1200);
    padding-top: var(--space-1200);
  }

  .lgPaddingX1200 {
    padding-left: var(--space-1200);
    padding-right: var(--space-1200);
  }

  html:not([dir="rtl"]) .lgMarginStart1300 {
    margin-left: var(--space-1300);
  }

  html:not([dir="rtl"]) .lgMarginEnd1300 {
    margin-right: var(--space-1300);
  }

  html[dir="rtl"] .lgMarginStart1300 {
    margin-right: var(--space-1300);
  }

  html[dir="rtl"] .lgMarginEnd1300 {
    margin-left: var(--space-1300);
  }

  html:not([dir="rtl"]) .lgMarginStartN1300 {
    margin-left: var(--space-negative-1300);
  }

  html:not([dir="rtl"]) .lgMarginEndN1300 {
    margin-right: var(--space-negative-1300);
  }

  html[dir="rtl"] .lgMarginStartN1300 {
    margin-right: var(--space-negative-1300);
  }

  html[dir="rtl"] .lgMarginEndN1300 {
    margin-left: var(--space-negative-1300);
  }

  .lgMarginTop1300 {
    margin-top: var(--space-1300);
  }

  .lgMarginBottom1300 {
    margin-bottom: var(--space-1300);
  }

  .lgMarginTopN1300 {
    margin-top: var(--space-negative-1300);
  }

  .lgMarginBottomN1300 {
    margin-bottom: var(--space-negative-1300);
  }

  .lgPaddingY1300 {
    padding-bottom: var(--space-1300);
    padding-top: var(--space-1300);
  }

  .lgPaddingX1300 {
    padding-left: var(--space-1300);
    padding-right: var(--space-1300);
  }

  html:not([dir="rtl"]) .lgMarginStart1400 {
    margin-left: var(--space-1400);
  }

  html:not([dir="rtl"]) .lgMarginEnd1400 {
    margin-right: var(--space-1400);
  }

  html[dir="rtl"] .lgMarginStart1400 {
    margin-right: var(--space-1400);
  }

  html[dir="rtl"] .lgMarginEnd1400 {
    margin-left: var(--space-1400);
  }

  html:not([dir="rtl"]) .lgMarginStartN1400 {
    margin-left: var(--space-negative-1400);
  }

  html:not([dir="rtl"]) .lgMarginEndN1400 {
    margin-right: var(--space-negative-1400);
  }

  html[dir="rtl"] .lgMarginStartN1400 {
    margin-right: var(--space-negative-1400);
  }

  html[dir="rtl"] .lgMarginEndN1400 {
    margin-left: var(--space-negative-1400);
  }

  .lgMarginTop1400 {
    margin-top: var(--space-1400);
  }

  .lgMarginBottom1400 {
    margin-bottom: var(--space-1400);
  }

  .lgMarginTopN1400 {
    margin-top: var(--space-negative-1400);
  }

  .lgMarginBottomN1400 {
    margin-bottom: var(--space-negative-1400);
  }

  .lgPaddingY1400 {
    padding-bottom: var(--space-1400);
    padding-top: var(--space-1400);
  }

  .lgPaddingX1400 {
    padding-left: var(--space-1400);
    padding-right: var(--space-1400);
  }

  html:not([dir="rtl"]) .lgMarginStart1500 {
    margin-left: var(--space-1500);
  }

  html:not([dir="rtl"]) .lgMarginEnd1500 {
    margin-right: var(--space-1500);
  }

  html[dir="rtl"] .lgMarginStart1500 {
    margin-right: var(--space-1500);
  }

  html[dir="rtl"] .lgMarginEnd1500 {
    margin-left: var(--space-1500);
  }

  html:not([dir="rtl"]) .lgMarginStartN1500 {
    margin-left: var(--space-negative-1500);
  }

  html:not([dir="rtl"]) .lgMarginEndN1500 {
    margin-right: var(--space-negative-1500);
  }

  html[dir="rtl"] .lgMarginStartN1500 {
    margin-right: var(--space-negative-1500);
  }

  html[dir="rtl"] .lgMarginEndN1500 {
    margin-left: var(--space-negative-1500);
  }

  .lgMarginTop1500 {
    margin-top: var(--space-1500);
  }

  .lgMarginBottom1500 {
    margin-bottom: var(--space-1500);
  }

  .lgMarginTopN1500 {
    margin-top: var(--space-negative-1500);
  }

  .lgMarginBottomN1500 {
    margin-bottom: var(--space-negative-1500);
  }

  .lgPaddingY1500 {
    padding-bottom: var(--space-1500);
    padding-top: var(--space-1500);
  }

  .lgPaddingX1500 {
    padding-left: var(--space-1500);
    padding-right: var(--space-1500);
  }

  html:not([dir="rtl"]) .lgMarginStart1600 {
    margin-left: var(--space-1600);
  }

  html:not([dir="rtl"]) .lgMarginEnd1600 {
    margin-right: var(--space-1600);
  }

  html[dir="rtl"] .lgMarginStart1600 {
    margin-right: var(--space-1600);
  }

  html[dir="rtl"] .lgMarginEnd1600 {
    margin-left: var(--space-1600);
  }

  html:not([dir="rtl"]) .lgMarginStartN1600 {
    margin-left: var(--space-negative-1600);
  }

  html:not([dir="rtl"]) .lgMarginEndN1600 {
    margin-right: var(--space-negative-1600);
  }

  html[dir="rtl"] .lgMarginStartN1600 {
    margin-right: var(--space-negative-1600);
  }

  html[dir="rtl"] .lgMarginEndN1600 {
    margin-left: var(--space-negative-1600);
  }

  .lgMarginTop1600 {
    margin-top: var(--space-1600);
  }

  .lgMarginBottom1600 {
    margin-bottom: var(--space-1600);
  }

  .lgMarginTopN1600 {
    margin-top: var(--space-negative-1600);
  }

  .lgMarginBottomN1600 {
    margin-bottom: var(--space-negative-1600);
  }

  .lgPaddingY1600 {
    padding-bottom: var(--space-1600);
    padding-top: var(--space-1600);
  }

  .lgPaddingX1600 {
    padding-left: var(--space-1600);
    padding-right: var(--space-1600);
  }

  html:not([dir="rtl"]) .lgMarginStart200 {
    margin-left: var(--space-200);
  }

  html:not([dir="rtl"]) .lgMarginEnd200 {
    margin-right: var(--space-200);
  }

  html[dir="rtl"] .lgMarginStart200 {
    margin-right: var(--space-200);
  }

  html[dir="rtl"] .lgMarginEnd200 {
    margin-left: var(--space-200);
  }

  html:not([dir="rtl"]) .lgMarginStartN200 {
    margin-left: var(--space-negative-200);
  }

  html:not([dir="rtl"]) .lgMarginEndN200 {
    margin-right: var(--space-negative-200);
  }

  html[dir="rtl"] .lgMarginStartN200 {
    margin-right: var(--space-negative-200);
  }

  html[dir="rtl"] .lgMarginEndN200 {
    margin-left: var(--space-negative-200);
  }

  .lgMarginTop200 {
    margin-top: var(--space-200);
  }

  .lgMarginBottom200 {
    margin-bottom: var(--space-200);
  }

  .lgMarginTopN200 {
    margin-top: var(--space-negative-200);
  }

  .lgMarginBottomN200 {
    margin-bottom: var(--space-negative-200);
  }

  .lgPaddingY200 {
    padding-bottom: var(--space-200);
    padding-top: var(--space-200);
  }

  .lgPaddingX200 {
    padding-left: var(--space-200);
    padding-right: var(--space-200);
  }

  html:not([dir="rtl"]) .lgMarginStart300 {
    margin-left: var(--space-300);
  }

  html:not([dir="rtl"]) .lgMarginEnd300 {
    margin-right: var(--space-300);
  }

  html[dir="rtl"] .lgMarginStart300 {
    margin-right: var(--space-300);
  }

  html[dir="rtl"] .lgMarginEnd300 {
    margin-left: var(--space-300);
  }

  html:not([dir="rtl"]) .lgMarginStartN300 {
    margin-left: var(--space-negative-300);
  }

  html:not([dir="rtl"]) .lgMarginEndN300 {
    margin-right: var(--space-negative-300);
  }

  html[dir="rtl"] .lgMarginStartN300 {
    margin-right: var(--space-negative-300);
  }

  html[dir="rtl"] .lgMarginEndN300 {
    margin-left: var(--space-negative-300);
  }

  .lgMarginTop300 {
    margin-top: var(--space-300);
  }

  .lgMarginBottom300 {
    margin-bottom: var(--space-300);
  }

  .lgMarginTopN300 {
    margin-top: var(--space-negative-300);
  }

  .lgMarginBottomN300 {
    margin-bottom: var(--space-negative-300);
  }

  .lgPaddingY300 {
    padding-bottom: var(--space-300);
    padding-top: var(--space-300);
  }

  .lgPaddingX300 {
    padding-left: var(--space-300);
    padding-right: var(--space-300);
  }

  html:not([dir="rtl"]) .lgMarginStart400 {
    margin-left: var(--space-400);
  }

  html:not([dir="rtl"]) .lgMarginEnd400 {
    margin-right: var(--space-400);
  }

  html[dir="rtl"] .lgMarginStart400 {
    margin-right: var(--space-400);
  }

  html[dir="rtl"] .lgMarginEnd400 {
    margin-left: var(--space-400);
  }

  html:not([dir="rtl"]) .lgMarginStartN400 {
    margin-left: var(--space-negative-400);
  }

  html:not([dir="rtl"]) .lgMarginEndN400 {
    margin-right: var(--space-negative-400);
  }

  html[dir="rtl"] .lgMarginStartN400 {
    margin-right: var(--space-negative-400);
  }

  html[dir="rtl"] .lgMarginEndN400 {
    margin-left: var(--space-negative-400);
  }

  .lgMarginTop400 {
    margin-top: var(--space-400);
  }

  .lgMarginBottom400 {
    margin-bottom: var(--space-400);
  }

  .lgMarginTopN400 {
    margin-top: var(--space-negative-400);
  }

  .lgMarginBottomN400 {
    margin-bottom: var(--space-negative-400);
  }

  .lgPaddingY400 {
    padding-bottom: var(--space-400);
    padding-top: var(--space-400);
  }

  .lgPaddingX400 {
    padding-left: var(--space-400);
    padding-right: var(--space-400);
  }

  html:not([dir="rtl"]) .lgMarginStart500 {
    margin-left: var(--space-500);
  }

  html:not([dir="rtl"]) .lgMarginEnd500 {
    margin-right: var(--space-500);
  }

  html[dir="rtl"] .lgMarginStart500 {
    margin-right: var(--space-500);
  }

  html[dir="rtl"] .lgMarginEnd500 {
    margin-left: var(--space-500);
  }

  html:not([dir="rtl"]) .lgMarginStartN500 {
    margin-left: var(--space-negative-500);
  }

  html:not([dir="rtl"]) .lgMarginEndN500 {
    margin-right: var(--space-negative-500);
  }

  html[dir="rtl"] .lgMarginStartN500 {
    margin-right: var(--space-negative-500);
  }

  html[dir="rtl"] .lgMarginEndN500 {
    margin-left: var(--space-negative-500);
  }

  .lgMarginTop500 {
    margin-top: var(--space-500);
  }

  .lgMarginBottom500 {
    margin-bottom: var(--space-500);
  }

  .lgMarginTopN500 {
    margin-top: var(--space-negative-500);
  }

  .lgMarginBottomN500 {
    margin-bottom: var(--space-negative-500);
  }

  .lgPaddingY500 {
    padding-bottom: var(--space-500);
    padding-top: var(--space-500);
  }

  .lgPaddingX500 {
    padding-left: var(--space-500);
    padding-right: var(--space-500);
  }

  html:not([dir="rtl"]) .lgMarginStart600 {
    margin-left: var(--space-600);
  }

  html:not([dir="rtl"]) .lgMarginEnd600 {
    margin-right: var(--space-600);
  }

  html[dir="rtl"] .lgMarginStart600 {
    margin-right: var(--space-600);
  }

  html[dir="rtl"] .lgMarginEnd600 {
    margin-left: var(--space-600);
  }

  html:not([dir="rtl"]) .lgMarginStartN600 {
    margin-left: var(--space-negative-600);
  }

  html:not([dir="rtl"]) .lgMarginEndN600 {
    margin-right: var(--space-negative-600);
  }

  html[dir="rtl"] .lgMarginStartN600 {
    margin-right: var(--space-negative-600);
  }

  html[dir="rtl"] .lgMarginEndN600 {
    margin-left: var(--space-negative-600);
  }

  .lgMarginTop600 {
    margin-top: var(--space-600);
  }

  .lgMarginBottom600 {
    margin-bottom: var(--space-600);
  }

  .lgMarginTopN600 {
    margin-top: var(--space-negative-600);
  }

  .lgMarginBottomN600 {
    margin-bottom: var(--space-negative-600);
  }

  .lgPaddingY600 {
    padding-bottom: var(--space-600);
    padding-top: var(--space-600);
  }

  .lgPaddingX600 {
    padding-left: var(--space-600);
    padding-right: var(--space-600);
  }

  html:not([dir="rtl"]) .lgMarginStart700 {
    margin-left: var(--space-700);
  }

  html:not([dir="rtl"]) .lgMarginEnd700 {
    margin-right: var(--space-700);
  }

  html[dir="rtl"] .lgMarginStart700 {
    margin-right: var(--space-700);
  }

  html[dir="rtl"] .lgMarginEnd700 {
    margin-left: var(--space-700);
  }

  html:not([dir="rtl"]) .lgMarginStartN700 {
    margin-left: var(--space-negative-700);
  }

  html:not([dir="rtl"]) .lgMarginEndN700 {
    margin-right: var(--space-negative-700);
  }

  html[dir="rtl"] .lgMarginStartN700 {
    margin-right: var(--space-negative-700);
  }

  html[dir="rtl"] .lgMarginEndN700 {
    margin-left: var(--space-negative-700);
  }

  .lgMarginTop700 {
    margin-top: var(--space-700);
  }

  .lgMarginBottom700 {
    margin-bottom: var(--space-700);
  }

  .lgMarginTopN700 {
    margin-top: var(--space-negative-700);
  }

  .lgMarginBottomN700 {
    margin-bottom: var(--space-negative-700);
  }

  .lgPaddingY700 {
    padding-bottom: var(--space-700);
    padding-top: var(--space-700);
  }

  .lgPaddingX700 {
    padding-left: var(--space-700);
    padding-right: var(--space-700);
  }

  html:not([dir="rtl"]) .lgMarginStart800 {
    margin-left: var(--space-800);
  }

  html:not([dir="rtl"]) .lgMarginEnd800 {
    margin-right: var(--space-800);
  }

  html[dir="rtl"] .lgMarginStart800 {
    margin-right: var(--space-800);
  }

  html[dir="rtl"] .lgMarginEnd800 {
    margin-left: var(--space-800);
  }

  html:not([dir="rtl"]) .lgMarginStartN800 {
    margin-left: var(--space-negative-800);
  }

  html:not([dir="rtl"]) .lgMarginEndN800 {
    margin-right: var(--space-negative-800);
  }

  html[dir="rtl"] .lgMarginStartN800 {
    margin-right: var(--space-negative-800);
  }

  html[dir="rtl"] .lgMarginEndN800 {
    margin-left: var(--space-negative-800);
  }

  .lgMarginTop800 {
    margin-top: var(--space-800);
  }

  .lgMarginBottom800 {
    margin-bottom: var(--space-800);
  }

  .lgMarginTopN800 {
    margin-top: var(--space-negative-800);
  }

  .lgMarginBottomN800 {
    margin-bottom: var(--space-negative-800);
  }

  .lgPaddingY800 {
    padding-bottom: var(--space-800);
    padding-top: var(--space-800);
  }

  .lgPaddingX800 {
    padding-left: var(--space-800);
    padding-right: var(--space-800);
  }

  html:not([dir="rtl"]) .lgMarginStart900 {
    margin-left: var(--space-900);
  }

  html:not([dir="rtl"]) .lgMarginEnd900 {
    margin-right: var(--space-900);
  }

  html[dir="rtl"] .lgMarginStart900 {
    margin-right: var(--space-900);
  }

  html[dir="rtl"] .lgMarginEnd900 {
    margin-left: var(--space-900);
  }

  html:not([dir="rtl"]) .lgMarginStartN900 {
    margin-left: var(--space-negative-900);
  }

  html:not([dir="rtl"]) .lgMarginEndN900 {
    margin-right: var(--space-negative-900);
  }

  html[dir="rtl"] .lgMarginStartN900 {
    margin-right: var(--space-negative-900);
  }

  html[dir="rtl"] .lgMarginEndN900 {
    margin-left: var(--space-negative-900);
  }

  .lgMarginTop900 {
    margin-top: var(--space-900);
  }

  .lgMarginBottom900 {
    margin-bottom: var(--space-900);
  }

  .lgMarginTopN900 {
    margin-top: var(--space-negative-900);
  }

  .lgMarginBottomN900 {
    margin-bottom: var(--space-negative-900);
  }

  .lgPaddingY900 {
    padding-bottom: var(--space-900);
    padding-top: var(--space-900);
  }

  .lgPaddingX900 {
    padding-left: var(--space-900);
    padding-right: var(--space-900);
  }
}

@media (--g-xl) {
  html:not([dir="rtl"]) .xlMarginStartAuto {
    margin-left: auto;
  }

  html:not([dir="rtl"]) .xlMarginEndAuto {
    margin-right: auto;
  }

  html[dir="rtl"] .xlMarginStartAuto {
    margin-right: auto;
  }

  html[dir="rtl"] .xlMarginEndAuto {
    margin-left: auto;
  }

  .xlMarginTopAuto {
    margin-top: auto;
  }

  .xlMarginBottomAuto {
    margin-bottom: auto;
  }
}

@media (--g-xl) {
  html:not([dir="rtl"]) .xlMarginStart0 {
    margin-left: var(--space-0);
  }

  html:not([dir="rtl"]) .xlMarginEnd0 {
    margin-right: var(--space-0);
  }

  html[dir="rtl"] .xlMarginStart0 {
    margin-right: var(--space-0);
  }

  html[dir="rtl"] .xlMarginEnd0 {
    margin-left: var(--space-0);
  }

  .xlMarginTop0 {
    margin-top: var(--space-0);
  }

  .xlMarginBottom0 {
    margin-bottom: var(--space-0);
  }

  .xlPaddingY0 {
    padding-bottom: var(--space-0);
    padding-top: var(--space-0);
  }

  .xlPaddingX0 {
    padding-left: var(--space-0);
    padding-right: var(--space-0);
  }

  html:not([dir="rtl"]) .xlMarginStart25 {
    margin-left: 1px;
  }

  html:not([dir="rtl"]) .xlMarginEnd25 {
    margin-right: 1px;
  }

  html[dir="rtl"] .xlMarginStart25 {
    margin-right: 1px;
  }

  html[dir="rtl"] .xlMarginEnd25 {
    margin-left: 1px;
  }

  html:not([dir="rtl"]) .xlMarginStartN25 {
    margin-left: -1px;
  }

  html:not([dir="rtl"]) .xlMarginEndN25 {
    margin-right: -1px;
  }

  html[dir="rtl"] .xlMarginStartN25 {
    margin-right: -1px;
  }

  html[dir="rtl"] .xlMarginEndN25 {
    margin-left: -1px;
  }

  .xlMarginTop25 {
    margin-top: 1px;
  }

  .xlMarginBottom25 {
    margin-bottom: 1px;
  }

  .xlMarginTopN25 {
    margin-top: -1px;
  }

  .xlMarginBottomN25 {
    margin-bottom: -1px;
  }

  .xlPaddingY25 {
    padding-bottom: 1px;
    padding-top: 1px;
  }

  .xlPaddingX25 {
    padding-left: 1px;
    padding-right: 1px;
  }

  html:not([dir="rtl"]) .xlMarginStart50 {
    margin-left: 2px;
  }

  html:not([dir="rtl"]) .xlMarginEnd50 {
    margin-right: 2px;
  }

  html[dir="rtl"] .xlMarginStart50 {
    margin-right: 2px;
  }

  html[dir="rtl"] .xlMarginEnd50 {
    margin-left: 2px;
  }

  html:not([dir="rtl"]) .xlMarginStartN50 {
    margin-left: -2px;
  }

  html:not([dir="rtl"]) .xlMarginEndN50 {
    margin-right: -2px;
  }

  html[dir="rtl"] .xlMarginStartN50 {
    margin-right: -2px;
  }

  html[dir="rtl"] .xlMarginEndN50 {
    margin-left: -2px;
  }

  .xlMarginTop50 {
    margin-top: 2px;
  }

  .xlMarginBottom50 {
    margin-bottom: 2px;
  }

  .xlMarginTopN50 {
    margin-top: -2px;
  }

  .xlMarginBottomN50 {
    margin-bottom: -2px;
  }

  .xlPaddingY50 {
    padding-bottom: 2px;
    padding-top: 2px;
  }

  .xlPaddingX50 {
    padding-left: 2px;
    padding-right: 2px;
  }

  html:not([dir="rtl"]) .xlMarginStart100 {
    margin-left: var(--space-100);
  }

  html:not([dir="rtl"]) .xlMarginEnd100 {
    margin-right: var(--space-100);
  }

  html[dir="rtl"] .xlMarginStart100 {
    margin-right: var(--space-100);
  }

  html[dir="rtl"] .xlMarginEnd100 {
    margin-left: var(--space-100);
  }

  html:not([dir="rtl"]) .xlMarginStartN100 {
    margin-left: var(--space-negative-100);
  }

  html:not([dir="rtl"]) .xlMarginEndN100 {
    margin-right: var(--space-negative-100);
  }

  html[dir="rtl"] .xlMarginStartN100 {
    margin-right: var(--space-negative-100);
  }

  html[dir="rtl"] .xlMarginEndN100 {
    margin-left: var(--space-negative-100);
  }

  .xlMarginTop100 {
    margin-top: var(--space-100);
  }

  .xlMarginBottom100 {
    margin-bottom: var(--space-100);
  }

  .xlMarginTopN100 {
    margin-top: var(--space-negative-100);
  }

  .xlMarginBottomN100 {
    margin-bottom: var(--space-negative-100);
  }

  .xlPaddingY100 {
    padding-bottom: var(--space-100);
    padding-top: var(--space-100);
  }

  .xlPaddingX100 {
    padding-left: var(--space-100);
    padding-right: var(--space-100);
  }

  html:not([dir="rtl"]) .xlMarginStart150 {
    margin-left: 6px;
  }

  html:not([dir="rtl"]) .xlMarginEnd150 {
    margin-right: 6px;
  }

  html[dir="rtl"] .xlMarginStart150 {
    margin-right: 6px;
  }

  html[dir="rtl"] .xlMarginEnd150 {
    margin-left: 6px;
  }

  html:not([dir="rtl"]) .xlMarginStartN150 {
    margin-left: -6px;
  }

  html:not([dir="rtl"]) .xlMarginEndN150 {
    margin-right: -6px;
  }

  html[dir="rtl"] .xlMarginStartN150 {
    margin-right: -6px;
  }

  html[dir="rtl"] .xlMarginEndN150 {
    margin-left: -6px;
  }

  .xlMarginTop150 {
    margin-top: 6px;
  }

  .xlMarginBottom150 {
    margin-bottom: 6px;
  }

  .xlMarginTopN150 {
    margin-top: -6px;
  }

  .xlMarginBottomN150 {
    margin-bottom: -6px;
  }

  .xlPaddingY150 {
    padding-bottom: 6px;
    padding-top: 6px;
  }

  .xlPaddingX150 {
    padding-left: 6px;
    padding-right: 6px;
  }

  html:not([dir="rtl"]) .xlMarginStart1000 {
    margin-left: var(--space-1000);
  }

  html:not([dir="rtl"]) .xlMarginEnd1000 {
    margin-right: var(--space-1000);
  }

  html[dir="rtl"] .xlMarginStart1000 {
    margin-right: var(--space-1000);
  }

  html[dir="rtl"] .xlMarginEnd1000 {
    margin-left: var(--space-1000);
  }

  html:not([dir="rtl"]) .xlMarginStartN1000 {
    margin-left: var(--space-negative-1000);
  }

  html:not([dir="rtl"]) .xlMarginEndN1000 {
    margin-right: var(--space-negative-1000);
  }

  html[dir="rtl"] .xlMarginStartN1000 {
    margin-right: var(--space-negative-1000);
  }

  html[dir="rtl"] .xlMarginEndN1000 {
    margin-left: var(--space-negative-1000);
  }

  .xlMarginTop1000 {
    margin-top: var(--space-1000);
  }

  .xlMarginBottom1000 {
    margin-bottom: var(--space-1000);
  }

  .xlMarginTopN1000 {
    margin-top: var(--space-negative-1000);
  }

  .xlMarginBottomN1000 {
    margin-bottom: var(--space-negative-1000);
  }

  .xlPaddingY1000 {
    padding-bottom: var(--space-1000);
    padding-top: var(--space-1000);
  }

  .xlPaddingX1000 {
    padding-left: var(--space-1000);
    padding-right: var(--space-1000);
  }

  html:not([dir="rtl"]) .xlMarginStart1100 {
    margin-left: var(--space-1100);
  }

  html:not([dir="rtl"]) .xlMarginEnd1100 {
    margin-right: var(--space-1100);
  }

  html[dir="rtl"] .xlMarginStart1100 {
    margin-right: var(--space-1100);
  }

  html[dir="rtl"] .xlMarginEnd1100 {
    margin-left: var(--space-1100);
  }

  html:not([dir="rtl"]) .xlMarginStartN1100 {
    margin-left: var(--space-negative-1100);
  }

  html:not([dir="rtl"]) .xlMarginEndN1100 {
    margin-right: var(--space-negative-1100);
  }

  html[dir="rtl"] .xlMarginStartN1100 {
    margin-right: var(--space-negative-1100);
  }

  html[dir="rtl"] .xlMarginEndN1100 {
    margin-left: var(--space-negative-1100);
  }

  .xlMarginTop1100 {
    margin-top: var(--space-1100);
  }

  .xlMarginBottom1100 {
    margin-bottom: var(--space-1100);
  }

  .xlMarginTopN1100 {
    margin-top: var(--space-negative-1100);
  }

  .xlMarginBottomN1100 {
    margin-bottom: var(--space-negative-1100);
  }

  .xlPaddingY1100 {
    padding-bottom: var(--space-1100);
    padding-top: var(--space-1100);
  }

  .xlPaddingX1100 {
    padding-left: var(--space-1100);
    padding-right: var(--space-1100);
  }

  html:not([dir="rtl"]) .xlMarginStart1200 {
    margin-left: var(--space-1200);
  }

  html:not([dir="rtl"]) .xlMarginEnd1200 {
    margin-right: var(--space-1200);
  }

  html[dir="rtl"] .xlMarginStart1200 {
    margin-right: var(--space-1200);
  }

  html[dir="rtl"] .xlMarginEnd1200 {
    margin-left: var(--space-1200);
  }

  html:not([dir="rtl"]) .xlMarginStartN1200 {
    margin-left: var(--space-negative-1200);
  }

  html:not([dir="rtl"]) .xlMarginEndN1200 {
    margin-right: var(--space-negative-1200);
  }

  html[dir="rtl"] .xlMarginStartN1200 {
    margin-right: var(--space-negative-1200);
  }

  html[dir="rtl"] .xlMarginEndN1200 {
    margin-left: var(--space-negative-1200);
  }

  .xlMarginTop1200 {
    margin-top: var(--space-1200);
  }

  .xlMarginBottom1200 {
    margin-bottom: var(--space-1200);
  }

  .xlMarginTopN1200 {
    margin-top: var(--space-negative-1200);
  }

  .xlMarginBottomN1200 {
    margin-bottom: var(--space-negative-1200);
  }

  .xlPaddingY1200 {
    padding-bottom: var(--space-1200);
    padding-top: var(--space-1200);
  }

  .xlPaddingX1200 {
    padding-left: var(--space-1200);
    padding-right: var(--space-1200);
  }

  html:not([dir="rtl"]) .xlMarginStart1300 {
    margin-left: var(--space-1300);
  }

  html:not([dir="rtl"]) .xlMarginEnd1300 {
    margin-right: var(--space-1300);
  }

  html[dir="rtl"] .xlMarginStart1300 {
    margin-right: var(--space-1300);
  }

  html[dir="rtl"] .xlMarginEnd1300 {
    margin-left: var(--space-1300);
  }

  html:not([dir="rtl"]) .xlMarginStartN1300 {
    margin-left: var(--space-negative-1300);
  }

  html:not([dir="rtl"]) .xlMarginEndN1300 {
    margin-right: var(--space-negative-1300);
  }

  html[dir="rtl"] .xlMarginStartN1300 {
    margin-right: var(--space-negative-1300);
  }

  html[dir="rtl"] .xlMarginEndN1300 {
    margin-left: var(--space-negative-1300);
  }

  .xlMarginTop1300 {
    margin-top: var(--space-1300);
  }

  .xlMarginBottom1300 {
    margin-bottom: var(--space-1300);
  }

  .xlMarginTopN1300 {
    margin-top: var(--space-negative-1300);
  }

  .xlMarginBottomN1300 {
    margin-bottom: var(--space-negative-1300);
  }

  .xlPaddingY1300 {
    padding-bottom: var(--space-1300);
    padding-top: var(--space-1300);
  }

  .xlPaddingX1300 {
    padding-left: var(--space-1300);
    padding-right: var(--space-1300);
  }

  html:not([dir="rtl"]) .xlMarginStart1400 {
    margin-left: var(--space-1400);
  }

  html:not([dir="rtl"]) .xlMarginEnd1400 {
    margin-right: var(--space-1400);
  }

  html[dir="rtl"] .xlMarginStart1400 {
    margin-right: var(--space-1400);
  }

  html[dir="rtl"] .xlMarginEnd1400 {
    margin-left: var(--space-1400);
  }

  html:not([dir="rtl"]) .xlMarginStartN1400 {
    margin-left: var(--space-negative-1400);
  }

  html:not([dir="rtl"]) .xlMarginEndN1400 {
    margin-right: var(--space-negative-1400);
  }

  html[dir="rtl"] .xlMarginStartN1400 {
    margin-right: var(--space-negative-1400);
  }

  html[dir="rtl"] .xlMarginEndN1400 {
    margin-left: var(--space-negative-1400);
  }

  .xlMarginTop1400 {
    margin-top: var(--space-1400);
  }

  .xlMarginBottom1400 {
    margin-bottom: var(--space-1400);
  }

  .xlMarginTopN1400 {
    margin-top: var(--space-negative-1400);
  }

  .xlMarginBottomN1400 {
    margin-bottom: var(--space-negative-1400);
  }

  .xlPaddingY1400 {
    padding-bottom: var(--space-1400);
    padding-top: var(--space-1400);
  }

  .xlPaddingX1400 {
    padding-left: var(--space-1400);
    padding-right: var(--space-1400);
  }

  html:not([dir="rtl"]) .xlMarginStart1500 {
    margin-left: var(--space-1500);
  }

  html:not([dir="rtl"]) .xlMarginEnd1500 {
    margin-right: var(--space-1500);
  }

  html[dir="rtl"] .xlMarginStart1500 {
    margin-right: var(--space-1500);
  }

  html[dir="rtl"] .xlMarginEnd1500 {
    margin-left: var(--space-1500);
  }

  html:not([dir="rtl"]) .xlMarginStartN1500 {
    margin-left: var(--space-negative-1500);
  }

  html:not([dir="rtl"]) .xlMarginEndN1500 {
    margin-right: var(--space-negative-1500);
  }

  html[dir="rtl"] .xlMarginStartN1500 {
    margin-right: var(--space-negative-1500);
  }

  html[dir="rtl"] .xlMarginEndN1500 {
    margin-left: var(--space-negative-1500);
  }

  .xlMarginTop1500 {
    margin-top: var(--space-1500);
  }

  .xlMarginBottom1500 {
    margin-bottom: var(--space-1500);
  }

  .xlMarginTopN1500 {
    margin-top: var(--space-negative-1500);
  }

  .xlMarginBottomN1500 {
    margin-bottom: var(--space-negative-1500);
  }

  .xlPaddingY1500 {
    padding-bottom: var(--space-1500);
    padding-top: var(--space-1500);
  }

  .xlPaddingX1500 {
    padding-left: var(--space-1500);
    padding-right: var(--space-1500);
  }

  html:not([dir="rtl"]) .xlMarginStart1600 {
    margin-left: var(--space-1600);
  }

  html:not([dir="rtl"]) .xlMarginEnd1600 {
    margin-right: var(--space-1600);
  }

  html[dir="rtl"] .xlMarginStart1600 {
    margin-right: var(--space-1600);
  }

  html[dir="rtl"] .xlMarginEnd1600 {
    margin-left: var(--space-1600);
  }

  html:not([dir="rtl"]) .xlMarginStartN1600 {
    margin-left: var(--space-negative-1600);
  }

  html:not([dir="rtl"]) .xlMarginEndN1600 {
    margin-right: var(--space-negative-1600);
  }

  html[dir="rtl"] .xlMarginStartN1600 {
    margin-right: var(--space-negative-1600);
  }

  html[dir="rtl"] .xlMarginEndN1600 {
    margin-left: var(--space-negative-1600);
  }

  .xlMarginTop1600 {
    margin-top: var(--space-1600);
  }

  .xlMarginBottom1600 {
    margin-bottom: var(--space-1600);
  }

  .xlMarginTopN1600 {
    margin-top: var(--space-negative-1600);
  }

  .xlMarginBottomN1600 {
    margin-bottom: var(--space-negative-1600);
  }

  .xlPaddingY1600 {
    padding-bottom: var(--space-1600);
    padding-top: var(--space-1600);
  }

  .xlPaddingX1600 {
    padding-left: var(--space-1600);
    padding-right: var(--space-1600);
  }

  html:not([dir="rtl"]) .xlMarginStart200 {
    margin-left: var(--space-200);
  }

  html:not([dir="rtl"]) .xlMarginEnd200 {
    margin-right: var(--space-200);
  }

  html[dir="rtl"] .xlMarginStart200 {
    margin-right: var(--space-200);
  }

  html[dir="rtl"] .xlMarginEnd200 {
    margin-left: var(--space-200);
  }

  html:not([dir="rtl"]) .xlMarginStartN200 {
    margin-left: var(--space-negative-200);
  }

  html:not([dir="rtl"]) .xlMarginEndN200 {
    margin-right: var(--space-negative-200);
  }

  html[dir="rtl"] .xlMarginStartN200 {
    margin-right: var(--space-negative-200);
  }

  html[dir="rtl"] .xlMarginEndN200 {
    margin-left: var(--space-negative-200);
  }

  .xlMarginTop200 {
    margin-top: var(--space-200);
  }

  .xlMarginBottom200 {
    margin-bottom: var(--space-200);
  }

  .xlMarginTopN200 {
    margin-top: var(--space-negative-200);
  }

  .xlMarginBottomN200 {
    margin-bottom: var(--space-negative-200);
  }

  .xlPaddingY200 {
    padding-bottom: var(--space-200);
    padding-top: var(--space-200);
  }

  .xlPaddingX200 {
    padding-left: var(--space-200);
    padding-right: var(--space-200);
  }

  html:not([dir="rtl"]) .xlMarginStart300 {
    margin-left: var(--space-300);
  }

  html:not([dir="rtl"]) .xlMarginEnd300 {
    margin-right: var(--space-300);
  }

  html[dir="rtl"] .xlMarginStart300 {
    margin-right: var(--space-300);
  }

  html[dir="rtl"] .xlMarginEnd300 {
    margin-left: var(--space-300);
  }

  html:not([dir="rtl"]) .xlMarginStartN300 {
    margin-left: var(--space-negative-300);
  }

  html:not([dir="rtl"]) .xlMarginEndN300 {
    margin-right: var(--space-negative-300);
  }

  html[dir="rtl"] .xlMarginStartN300 {
    margin-right: var(--space-negative-300);
  }

  html[dir="rtl"] .xlMarginEndN300 {
    margin-left: var(--space-negative-300);
  }

  .xlMarginTop300 {
    margin-top: var(--space-300);
  }

  .xlMarginBottom300 {
    margin-bottom: var(--space-300);
  }

  .xlMarginTopN300 {
    margin-top: var(--space-negative-300);
  }

  .xlMarginBottomN300 {
    margin-bottom: var(--space-negative-300);
  }

  .xlPaddingY300 {
    padding-bottom: var(--space-300);
    padding-top: var(--space-300);
  }

  .xlPaddingX300 {
    padding-left: var(--space-300);
    padding-right: var(--space-300);
  }

  html:not([dir="rtl"]) .xlMarginStart400 {
    margin-left: var(--space-400);
  }

  html:not([dir="rtl"]) .xlMarginEnd400 {
    margin-right: var(--space-400);
  }

  html[dir="rtl"] .xlMarginStart400 {
    margin-right: var(--space-400);
  }

  html[dir="rtl"] .xlMarginEnd400 {
    margin-left: var(--space-400);
  }

  html:not([dir="rtl"]) .xlMarginStartN400 {
    margin-left: var(--space-negative-400);
  }

  html:not([dir="rtl"]) .xlMarginEndN400 {
    margin-right: var(--space-negative-400);
  }

  html[dir="rtl"] .xlMarginStartN400 {
    margin-right: var(--space-negative-400);
  }

  html[dir="rtl"] .xlMarginEndN400 {
    margin-left: var(--space-negative-400);
  }

  .xlMarginTop400 {
    margin-top: var(--space-400);
  }

  .xlMarginBottom400 {
    margin-bottom: var(--space-400);
  }

  .xlMarginTopN400 {
    margin-top: var(--space-negative-400);
  }

  .xlMarginBottomN400 {
    margin-bottom: var(--space-negative-400);
  }

  .xlPaddingY400 {
    padding-bottom: var(--space-400);
    padding-top: var(--space-400);
  }

  .xlPaddingX400 {
    padding-left: var(--space-400);
    padding-right: var(--space-400);
  }

  html:not([dir="rtl"]) .xlMarginStart500 {
    margin-left: var(--space-500);
  }

  html:not([dir="rtl"]) .xlMarginEnd500 {
    margin-right: var(--space-500);
  }

  html[dir="rtl"] .xlMarginStart500 {
    margin-right: var(--space-500);
  }

  html[dir="rtl"] .xlMarginEnd500 {
    margin-left: var(--space-500);
  }

  html:not([dir="rtl"]) .xlMarginStartN500 {
    margin-left: var(--space-negative-500);
  }

  html:not([dir="rtl"]) .xlMarginEndN500 {
    margin-right: var(--space-negative-500);
  }

  html[dir="rtl"] .xlMarginStartN500 {
    margin-right: var(--space-negative-500);
  }

  html[dir="rtl"] .xlMarginEndN500 {
    margin-left: var(--space-negative-500);
  }

  .xlMarginTop500 {
    margin-top: var(--space-500);
  }

  .xlMarginBottom500 {
    margin-bottom: var(--space-500);
  }

  .xlMarginTopN500 {
    margin-top: var(--space-negative-500);
  }

  .xlMarginBottomN500 {
    margin-bottom: var(--space-negative-500);
  }

  .xlPaddingY500 {
    padding-bottom: var(--space-500);
    padding-top: var(--space-500);
  }

  .xlPaddingX500 {
    padding-left: var(--space-500);
    padding-right: var(--space-500);
  }

  html:not([dir="rtl"]) .xlMarginStart600 {
    margin-left: var(--space-600);
  }

  html:not([dir="rtl"]) .xlMarginEnd600 {
    margin-right: var(--space-600);
  }

  html[dir="rtl"] .xlMarginStart600 {
    margin-right: var(--space-600);
  }

  html[dir="rtl"] .xlMarginEnd600 {
    margin-left: var(--space-600);
  }

  html:not([dir="rtl"]) .xlMarginStartN600 {
    margin-left: var(--space-negative-600);
  }

  html:not([dir="rtl"]) .xlMarginEndN600 {
    margin-right: var(--space-negative-600);
  }

  html[dir="rtl"] .xlMarginStartN600 {
    margin-right: var(--space-negative-600);
  }

  html[dir="rtl"] .xlMarginEndN600 {
    margin-left: var(--space-negative-600);
  }

  .xlMarginTop600 {
    margin-top: var(--space-600);
  }

  .xlMarginBottom600 {
    margin-bottom: var(--space-600);
  }

  .xlMarginTopN600 {
    margin-top: var(--space-negative-600);
  }

  .xlMarginBottomN600 {
    margin-bottom: var(--space-negative-600);
  }

  .xlPaddingY600 {
    padding-bottom: var(--space-600);
    padding-top: var(--space-600);
  }

  .xlPaddingX600 {
    padding-left: var(--space-600);
    padding-right: var(--space-600);
  }

  html:not([dir="rtl"]) .xlMarginStart700 {
    margin-left: var(--space-700);
  }

  html:not([dir="rtl"]) .xlMarginEnd700 {
    margin-right: var(--space-700);
  }

  html[dir="rtl"] .xlMarginStart700 {
    margin-right: var(--space-700);
  }

  html[dir="rtl"] .xlMarginEnd700 {
    margin-left: var(--space-700);
  }

  html:not([dir="rtl"]) .xlMarginStartN700 {
    margin-left: var(--space-negative-700);
  }

  html:not([dir="rtl"]) .xlMarginEndN700 {
    margin-right: var(--space-negative-700);
  }

  html[dir="rtl"] .xlMarginStartN700 {
    margin-right: var(--space-negative-700);
  }

  html[dir="rtl"] .xlMarginEndN700 {
    margin-left: var(--space-negative-700);
  }

  .xlMarginTop700 {
    margin-top: var(--space-700);
  }

  .xlMarginBottom700 {
    margin-bottom: var(--space-700);
  }

  .xlMarginTopN700 {
    margin-top: var(--space-negative-700);
  }

  .xlMarginBottomN700 {
    margin-bottom: var(--space-negative-700);
  }

  .xlPaddingY700 {
    padding-bottom: var(--space-700);
    padding-top: var(--space-700);
  }

  .xlPaddingX700 {
    padding-left: var(--space-700);
    padding-right: var(--space-700);
  }

  html:not([dir="rtl"]) .xlMarginStart800 {
    margin-left: var(--space-800);
  }

  html:not([dir="rtl"]) .xlMarginEnd800 {
    margin-right: var(--space-800);
  }

  html[dir="rtl"] .xlMarginStart800 {
    margin-right: var(--space-800);
  }

  html[dir="rtl"] .xlMarginEnd800 {
    margin-left: var(--space-800);
  }

  html:not([dir="rtl"]) .xlMarginStartN800 {
    margin-left: var(--space-negative-800);
  }

  html:not([dir="rtl"]) .xlMarginEndN800 {
    margin-right: var(--space-negative-800);
  }

  html[dir="rtl"] .xlMarginStartN800 {
    margin-right: var(--space-negative-800);
  }

  html[dir="rtl"] .xlMarginEndN800 {
    margin-left: var(--space-negative-800);
  }

  .xlMarginTop800 {
    margin-top: var(--space-800);
  }

  .xlMarginBottom800 {
    margin-bottom: var(--space-800);
  }

  .xlMarginTopN800 {
    margin-top: var(--space-negative-800);
  }

  .xlMarginBottomN800 {
    margin-bottom: var(--space-negative-800);
  }

  .xlPaddingY800 {
    padding-bottom: var(--space-800);
    padding-top: var(--space-800);
  }

  .xlPaddingX800 {
    padding-left: var(--space-800);
    padding-right: var(--space-800);
  }

  html:not([dir="rtl"]) .xlMarginStart900 {
    margin-left: var(--space-900);
  }

  html:not([dir="rtl"]) .xlMarginEnd900 {
    margin-right: var(--space-900);
  }

  html[dir="rtl"] .xlMarginStart900 {
    margin-right: var(--space-900);
  }

  html[dir="rtl"] .xlMarginEnd900 {
    margin-left: var(--space-900);
  }

  html:not([dir="rtl"]) .xlMarginStartN900 {
    margin-left: var(--space-negative-900);
  }

  html:not([dir="rtl"]) .xlMarginEndN900 {
    margin-right: var(--space-negative-900);
  }

  html[dir="rtl"] .xlMarginStartN900 {
    margin-right: var(--space-negative-900);
  }

  html[dir="rtl"] .xlMarginEndN900 {
    margin-left: var(--space-negative-900);
  }

  .xlMarginTop900 {
    margin-top: var(--space-900);
  }

  .xlMarginBottom900 {
    margin-bottom: var(--space-900);
  }

  .xlMarginTopN900 {
    margin-top: var(--space-negative-900);
  }

  .xlMarginBottomN900 {
    margin-bottom: var(--space-negative-900);
  }

  .xlPaddingY900 {
    padding-bottom: var(--space-900);
    padding-top: var(--space-900);
  }

  .xlPaddingX900 {
    padding-left: var(--space-900);
    padding-right: var(--space-900);
  }
}

@media (--g-xxl) {
  html:not([dir="rtl"]) .xxlMarginStartAuto {
    margin-left: auto;
  }

  html:not([dir="rtl"]) .xxlMarginEndAuto {
    margin-right: auto;
  }

  html[dir="rtl"] .xxlMarginStartAuto {
    margin-right: auto;
  }

  html[dir="rtl"] .xxlMarginEndAuto {
    margin-left: auto;
  }

  .xxlMarginTopAuto {
    margin-top: auto;
  }

  .xxlMarginBottomAuto {
    margin-bottom: auto;
  }
}

@media (--g-xxl) {
  html:not([dir="rtl"]) .xxlMarginStart0 {
    margin-left: var(--space-0);
  }

  html:not([dir="rtl"]) .xxlMarginEnd0 {
    margin-right: var(--space-0);
  }

  html[dir="rtl"] .xxlMarginStart0 {
    margin-right: var(--space-0);
  }

  html[dir="rtl"] .xxlMarginEnd0 {
    margin-left: var(--space-0);
  }

  .xxlMarginTop0 {
    margin-top: var(--space-0);
  }

  .xxlMarginBottom0 {
    margin-bottom: var(--space-0);
  }

  .xxlPaddingY0 {
    padding-bottom: var(--space-0);
    padding-top: var(--space-0);
  }

  .xxlPaddingX0 {
    padding-left: var(--space-0);
    padding-right: var(--space-0);
  }

  html:not([dir="rtl"]) .xxlMarginStart25 {
    margin-left: 1px;
  }

  html:not([dir="rtl"]) .xxlMarginEnd25 {
    margin-right: 1px;
  }

  html[dir="rtl"] .xxlMarginStart25 {
    margin-right: 1px;
  }

  html[dir="rtl"] .xxlMarginEnd25 {
    margin-left: 1px;
  }

  html:not([dir="rtl"]) .xxlMarginStartN25 {
    margin-left: -1px;
  }

  html:not([dir="rtl"]) .xxlMarginEndN25 {
    margin-right: -1px;
  }

  html[dir="rtl"] .xxlMarginStartN25 {
    margin-right: -1px;
  }

  html[dir="rtl"] .xxlMarginEndN25 {
    margin-left: -1px;
  }

  .xxlMarginTop25 {
    margin-top: 1px;
  }

  .xxlMarginBottom25 {
    margin-bottom: 1px;
  }

  .xxlMarginTopN25 {
    margin-top: -1px;
  }

  .xxlMarginBottomN25 {
    margin-bottom: -1px;
  }

  .xxlPaddingY25 {
    padding-bottom: 1px;
    padding-top: 1px;
  }

  .xxlPaddingX25 {
    padding-left: 1px;
    padding-right: 1px;
  }

  html:not([dir="rtl"]) .xxlMarginStart50 {
    margin-left: 2px;
  }

  html:not([dir="rtl"]) .xxlMarginEnd50 {
    margin-right: 2px;
  }

  html[dir="rtl"] .xxlMarginStart50 {
    margin-right: 2px;
  }

  html[dir="rtl"] .xxlMarginEnd50 {
    margin-left: 2px;
  }

  html:not([dir="rtl"]) .xxlMarginStartN50 {
    margin-left: -2px;
  }

  html:not([dir="rtl"]) .xxlMarginEndN50 {
    margin-right: -2px;
  }

  html[dir="rtl"] .xxlMarginStartN50 {
    margin-right: -2px;
  }

  html[dir="rtl"] .xxlMarginEndN50 {
    margin-left: -2px;
  }

  .xxlMarginTop50 {
    margin-top: 2px;
  }

  .xxlMarginBottom50 {
    margin-bottom: 2px;
  }

  .xxlMarginTopN50 {
    margin-top: -2px;
  }

  .xxlMarginBottomN50 {
    margin-bottom: -2px;
  }

  .xxlPaddingY50 {
    padding-bottom: 2px;
    padding-top: 2px;
  }

  .xxlPaddingX50 {
    padding-left: 2px;
    padding-right: 2px;
  }

  html:not([dir="rtl"]) .xxlMarginStart100 {
    margin-left: var(--space-100);
  }

  html:not([dir="rtl"]) .xxlMarginEnd100 {
    margin-right: var(--space-100);
  }

  html[dir="rtl"] .xxlMarginStart100 {
    margin-right: var(--space-100);
  }

  html[dir="rtl"] .xxlMarginEnd100 {
    margin-left: var(--space-100);
  }

  html:not([dir="rtl"]) .xxlMarginStartN100 {
    margin-left: var(--space-negative-100);
  }

  html:not([dir="rtl"]) .xxlMarginEndN100 {
    margin-right: var(--space-negative-100);
  }

  html[dir="rtl"] .xxlMarginStartN100 {
    margin-right: var(--space-negative-100);
  }

  html[dir="rtl"] .xxlMarginEndN100 {
    margin-left: var(--space-negative-100);
  }

  .xxlMarginTop100 {
    margin-top: var(--space-100);
  }

  .xxlMarginBottom100 {
    margin-bottom: var(--space-100);
  }

  .xxlMarginTopN100 {
    margin-top: var(--space-negative-100);
  }

  .xxlMarginBottomN100 {
    margin-bottom: var(--space-negative-100);
  }

  .xxlPaddingY100 {
    padding-bottom: var(--space-100);
    padding-top: var(--space-100);
  }

  .xxlPaddingX100 {
    padding-left: var(--space-100);
    padding-right: var(--space-100);
  }

  html:not([dir="rtl"]) .xxlMarginStart150 {
    margin-left: 6px;
  }

  html:not([dir="rtl"]) .xxlMarginEnd150 {
    margin-right: 6px;
  }

  html[dir="rtl"] .xxlMarginStart150 {
    margin-right: 6px;
  }

  html[dir="rtl"] .xxlMarginEnd150 {
    margin-left: 6px;
  }

  html:not([dir="rtl"]) .xxlMarginStartN150 {
    margin-left: -6px;
  }

  html:not([dir="rtl"]) .xxlMarginEndN150 {
    margin-right: -6px;
  }

  html[dir="rtl"] .xxlMarginStartN150 {
    margin-right: -6px;
  }

  html[dir="rtl"] .xxlMarginEndN150 {
    margin-left: -6px;
  }

  .xxlMarginTop150 {
    margin-top: 6px;
  }

  .xxlMarginBottom150 {
    margin-bottom: 6px;
  }

  .xxlMarginTopN150 {
    margin-top: -6px;
  }

  .xxlMarginBottomN150 {
    margin-bottom: -6px;
  }

  .xxlPaddingY150 {
    padding-bottom: 6px;
    padding-top: 6px;
  }

  .xxlPaddingX150 {
    padding-left: 6px;
    padding-right: 6px;
  }

  html:not([dir="rtl"]) .xxlMarginStart1000 {
    margin-left: var(--space-1000);
  }

  html:not([dir="rtl"]) .xxlMarginEnd1000 {
    margin-right: var(--space-1000);
  }

  html[dir="rtl"] .xxlMarginStart1000 {
    margin-right: var(--space-1000);
  }

  html[dir="rtl"] .xxlMarginEnd1000 {
    margin-left: var(--space-1000);
  }

  html:not([dir="rtl"]) .xxlMarginStartN1000 {
    margin-left: var(--space-negative-1000);
  }

  html:not([dir="rtl"]) .xxlMarginEndN1000 {
    margin-right: var(--space-negative-1000);
  }

  html[dir="rtl"] .xxlMarginStartN1000 {
    margin-right: var(--space-negative-1000);
  }

  html[dir="rtl"] .xxlMarginEndN1000 {
    margin-left: var(--space-negative-1000);
  }

  .xxlMarginTop1000 {
    margin-top: var(--space-1000);
  }

  .xxlMarginBottom1000 {
    margin-bottom: var(--space-1000);
  }

  .xxlMarginTopN1000 {
    margin-top: var(--space-negative-1000);
  }

  .xxlMarginBottomN1000 {
    margin-bottom: var(--space-negative-1000);
  }

  .xxlPaddingY1000 {
    padding-bottom: var(--space-1000);
    padding-top: var(--space-1000);
  }

  .xxlPaddingX1000 {
    padding-left: var(--space-1000);
    padding-right: var(--space-1000);
  }

  html:not([dir="rtl"]) .xxlMarginStart1100 {
    margin-left: var(--space-1100);
  }

  html:not([dir="rtl"]) .xxlMarginEnd1100 {
    margin-right: var(--space-1100);
  }

  html[dir="rtl"] .xxlMarginStart1100 {
    margin-right: var(--space-1100);
  }

  html[dir="rtl"] .xxlMarginEnd1100 {
    margin-left: var(--space-1100);
  }

  html:not([dir="rtl"]) .xxlMarginStartN1100 {
    margin-left: var(--space-negative-1100);
  }

  html:not([dir="rtl"]) .xxlMarginEndN1100 {
    margin-right: var(--space-negative-1100);
  }

  html[dir="rtl"] .xxlMarginStartN1100 {
    margin-right: var(--space-negative-1100);
  }

  html[dir="rtl"] .xxlMarginEndN1100 {
    margin-left: var(--space-negative-1100);
  }

  .xxlMarginTop1100 {
    margin-top: var(--space-1100);
  }

  .xxlMarginBottom1100 {
    margin-bottom: var(--space-1100);
  }

  .xxlMarginTopN1100 {
    margin-top: var(--space-negative-1100);
  }

  .xxlMarginBottomN1100 {
    margin-bottom: var(--space-negative-1100);
  }

  .xxlPaddingY1100 {
    padding-bottom: var(--space-1100);
    padding-top: var(--space-1100);
  }

  .xxlPaddingX1100 {
    padding-left: var(--space-1100);
    padding-right: var(--space-1100);
  }

  html:not([dir="rtl"]) .xxlMarginStart1200 {
    margin-left: var(--space-1200);
  }

  html:not([dir="rtl"]) .xxlMarginEnd1200 {
    margin-right: var(--space-1200);
  }

  html[dir="rtl"] .xxlMarginStart1200 {
    margin-right: var(--space-1200);
  }

  html[dir="rtl"] .xxlMarginEnd1200 {
    margin-left: var(--space-1200);
  }

  html:not([dir="rtl"]) .xxlMarginStartN1200 {
    margin-left: var(--space-negative-1200);
  }

  html:not([dir="rtl"]) .xxlMarginEndN1200 {
    margin-right: var(--space-negative-1200);
  }

  html[dir="rtl"] .xxlMarginStartN1200 {
    margin-right: var(--space-negative-1200);
  }

  html[dir="rtl"] .xxlMarginEndN1200 {
    margin-left: var(--space-negative-1200);
  }

  .xxlMarginTop1200 {
    margin-top: var(--space-1200);
  }

  .xxlMarginBottom1200 {
    margin-bottom: var(--space-1200);
  }

  .xxlMarginTopN1200 {
    margin-top: var(--space-negative-1200);
  }

  .xxlMarginBottomN1200 {
    margin-bottom: var(--space-negative-1200);
  }

  .xxlPaddingY1200 {
    padding-bottom: var(--space-1200);
    padding-top: var(--space-1200);
  }

  .xxlPaddingX1200 {
    padding-left: var(--space-1200);
    padding-right: var(--space-1200);
  }

  html:not([dir="rtl"]) .xxlMarginStart1300 {
    margin-left: var(--space-1300);
  }

  html:not([dir="rtl"]) .xxlMarginEnd1300 {
    margin-right: var(--space-1300);
  }

  html[dir="rtl"] .xxlMarginStart1300 {
    margin-right: var(--space-1300);
  }

  html[dir="rtl"] .xxlMarginEnd1300 {
    margin-left: var(--space-1300);
  }

  html:not([dir="rtl"]) .xxlMarginStartN1300 {
    margin-left: var(--space-negative-1300);
  }

  html:not([dir="rtl"]) .xxlMarginEndN1300 {
    margin-right: var(--space-negative-1300);
  }

  html[dir="rtl"] .xxlMarginStartN1300 {
    margin-right: var(--space-negative-1300);
  }

  html[dir="rtl"] .xxlMarginEndN1300 {
    margin-left: var(--space-negative-1300);
  }

  .xxlMarginTop1300 {
    margin-top: var(--space-1300);
  }

  .xxlMarginBottom1300 {
    margin-bottom: var(--space-1300);
  }

  .xxlMarginTopN1300 {
    margin-top: var(--space-negative-1300);
  }

  .xxlMarginBottomN1300 {
    margin-bottom: var(--space-negative-1300);
  }

  .xxlPaddingY1300 {
    padding-bottom: var(--space-1300);
    padding-top: var(--space-1300);
  }

  .xxlPaddingX1300 {
    padding-left: var(--space-1300);
    padding-right: var(--space-1300);
  }

  html:not([dir="rtl"]) .xxlMarginStart1400 {
    margin-left: var(--space-1400);
  }

  html:not([dir="rtl"]) .xxlMarginEnd1400 {
    margin-right: var(--space-1400);
  }

  html[dir="rtl"] .xxlMarginStart1400 {
    margin-right: var(--space-1400);
  }

  html[dir="rtl"] .xxlMarginEnd1400 {
    margin-left: var(--space-1400);
  }

  html:not([dir="rtl"]) .xxlMarginStartN1400 {
    margin-left: var(--space-negative-1400);
  }

  html:not([dir="rtl"]) .xxlMarginEndN1400 {
    margin-right: var(--space-negative-1400);
  }

  html[dir="rtl"] .xxlMarginStartN1400 {
    margin-right: var(--space-negative-1400);
  }

  html[dir="rtl"] .xxlMarginEndN1400 {
    margin-left: var(--space-negative-1400);
  }

  .xxlMarginTop1400 {
    margin-top: var(--space-1400);
  }

  .xxlMarginBottom1400 {
    margin-bottom: var(--space-1400);
  }

  .xxlMarginTopN1400 {
    margin-top: var(--space-negative-1400);
  }

  .xxlMarginBottomN1400 {
    margin-bottom: var(--space-negative-1400);
  }

  .xxlPaddingY1400 {
    padding-bottom: var(--space-1400);
    padding-top: var(--space-1400);
  }

  .xxlPaddingX1400 {
    padding-left: var(--space-1400);
    padding-right: var(--space-1400);
  }

  html:not([dir="rtl"]) .xxlMarginStart1500 {
    margin-left: var(--space-1500);
  }

  html:not([dir="rtl"]) .xxlMarginEnd1500 {
    margin-right: var(--space-1500);
  }

  html[dir="rtl"] .xxlMarginStart1500 {
    margin-right: var(--space-1500);
  }

  html[dir="rtl"] .xxlMarginEnd1500 {
    margin-left: var(--space-1500);
  }

  html:not([dir="rtl"]) .xxlMarginStartN1500 {
    margin-left: var(--space-negative-1500);
  }

  html:not([dir="rtl"]) .xxlMarginEndN1500 {
    margin-right: var(--space-negative-1500);
  }

  html[dir="rtl"] .xxlMarginStartN1500 {
    margin-right: var(--space-negative-1500);
  }

  html[dir="rtl"] .xxlMarginEndN1500 {
    margin-left: var(--space-negative-1500);
  }

  .xxlMarginTop1500 {
    margin-top: var(--space-1500);
  }

  .xxlMarginBottom1500 {
    margin-bottom: var(--space-1500);
  }

  .xxlMarginTopN1500 {
    margin-top: var(--space-negative-1500);
  }

  .xxlMarginBottomN1500 {
    margin-bottom: var(--space-negative-1500);
  }

  .xxlPaddingY1500 {
    padding-bottom: var(--space-1500);
    padding-top: var(--space-1500);
  }

  .xxlPaddingX1500 {
    padding-left: var(--space-1500);
    padding-right: var(--space-1500);
  }

  html:not([dir="rtl"]) .xxlMarginStart1600 {
    margin-left: var(--space-1600);
  }

  html:not([dir="rtl"]) .xxlMarginEnd1600 {
    margin-right: var(--space-1600);
  }

  html[dir="rtl"] .xxlMarginStart1600 {
    margin-right: var(--space-1600);
  }

  html[dir="rtl"] .xxlMarginEnd1600 {
    margin-left: var(--space-1600);
  }

  html:not([dir="rtl"]) .xxlMarginStartN1600 {
    margin-left: var(--space-negative-1600);
  }

  html:not([dir="rtl"]) .xxlMarginEndN1600 {
    margin-right: var(--space-negative-1600);
  }

  html[dir="rtl"] .xxlMarginStartN1600 {
    margin-right: var(--space-negative-1600);
  }

  html[dir="rtl"] .xxlMarginEndN1600 {
    margin-left: var(--space-negative-1600);
  }

  .xxlMarginTop1600 {
    margin-top: var(--space-1600);
  }

  .xxlMarginBottom1600 {
    margin-bottom: var(--space-1600);
  }

  .xxlMarginTopN1600 {
    margin-top: var(--space-negative-1600);
  }

  .xxlMarginBottomN1600 {
    margin-bottom: var(--space-negative-1600);
  }

  .xxlPaddingY1600 {
    padding-bottom: var(--space-1600);
    padding-top: var(--space-1600);
  }

  .xxlPaddingX1600 {
    padding-left: var(--space-1600);
    padding-right: var(--space-1600);
  }

  html:not([dir="rtl"]) .xxlMarginStart200 {
    margin-left: var(--space-200);
  }

  html:not([dir="rtl"]) .xxlMarginEnd200 {
    margin-right: var(--space-200);
  }

  html[dir="rtl"] .xxlMarginStart200 {
    margin-right: var(--space-200);
  }

  html[dir="rtl"] .xxlMarginEnd200 {
    margin-left: var(--space-200);
  }

  html:not([dir="rtl"]) .xxlMarginStartN200 {
    margin-left: var(--space-negative-200);
  }

  html:not([dir="rtl"]) .xxlMarginEndN200 {
    margin-right: var(--space-negative-200);
  }

  html[dir="rtl"] .xxlMarginStartN200 {
    margin-right: var(--space-negative-200);
  }

  html[dir="rtl"] .xxlMarginEndN200 {
    margin-left: var(--space-negative-200);
  }

  .xxlMarginTop200 {
    margin-top: var(--space-200);
  }

  .xxlMarginBottom200 {
    margin-bottom: var(--space-200);
  }

  .xxlMarginTopN200 {
    margin-top: var(--space-negative-200);
  }

  .xxlMarginBottomN200 {
    margin-bottom: var(--space-negative-200);
  }

  .xxlPaddingY200 {
    padding-bottom: var(--space-200);
    padding-top: var(--space-200);
  }

  .xxlPaddingX200 {
    padding-left: var(--space-200);
    padding-right: var(--space-200);
  }

  html:not([dir="rtl"]) .xxlMarginStart300 {
    margin-left: var(--space-300);
  }

  html:not([dir="rtl"]) .xxlMarginEnd300 {
    margin-right: var(--space-300);
  }

  html[dir="rtl"] .xxlMarginStart300 {
    margin-right: var(--space-300);
  }

  html[dir="rtl"] .xxlMarginEnd300 {
    margin-left: var(--space-300);
  }

  html:not([dir="rtl"]) .xxlMarginStartN300 {
    margin-left: var(--space-negative-300);
  }

  html:not([dir="rtl"]) .xxlMarginEndN300 {
    margin-right: var(--space-negative-300);
  }

  html[dir="rtl"] .xxlMarginStartN300 {
    margin-right: var(--space-negative-300);
  }

  html[dir="rtl"] .xxlMarginEndN300 {
    margin-left: var(--space-negative-300);
  }

  .xxlMarginTop300 {
    margin-top: var(--space-300);
  }

  .xxlMarginBottom300 {
    margin-bottom: var(--space-300);
  }

  .xxlMarginTopN300 {
    margin-top: var(--space-negative-300);
  }

  .xxlMarginBottomN300 {
    margin-bottom: var(--space-negative-300);
  }

  .xxlPaddingY300 {
    padding-bottom: var(--space-300);
    padding-top: var(--space-300);
  }

  .xxlPaddingX300 {
    padding-left: var(--space-300);
    padding-right: var(--space-300);
  }

  html:not([dir="rtl"]) .xxlMarginStart400 {
    margin-left: var(--space-400);
  }

  html:not([dir="rtl"]) .xxlMarginEnd400 {
    margin-right: var(--space-400);
  }

  html[dir="rtl"] .xxlMarginStart400 {
    margin-right: var(--space-400);
  }

  html[dir="rtl"] .xxlMarginEnd400 {
    margin-left: var(--space-400);
  }

  html:not([dir="rtl"]) .xxlMarginStartN400 {
    margin-left: var(--space-negative-400);
  }

  html:not([dir="rtl"]) .xxlMarginEndN400 {
    margin-right: var(--space-negative-400);
  }

  html[dir="rtl"] .xxlMarginStartN400 {
    margin-right: var(--space-negative-400);
  }

  html[dir="rtl"] .xxlMarginEndN400 {
    margin-left: var(--space-negative-400);
  }

  .xxlMarginTop400 {
    margin-top: var(--space-400);
  }

  .xxlMarginBottom400 {
    margin-bottom: var(--space-400);
  }

  .xxlMarginTopN400 {
    margin-top: var(--space-negative-400);
  }

  .xxlMarginBottomN400 {
    margin-bottom: var(--space-negative-400);
  }

  .xxlPaddingY400 {
    padding-bottom: var(--space-400);
    padding-top: var(--space-400);
  }

  .xxlPaddingX400 {
    padding-left: var(--space-400);
    padding-right: var(--space-400);
  }

  html:not([dir="rtl"]) .xxlMarginStart500 {
    margin-left: var(--space-500);
  }

  html:not([dir="rtl"]) .xxlMarginEnd500 {
    margin-right: var(--space-500);
  }

  html[dir="rtl"] .xxlMarginStart500 {
    margin-right: var(--space-500);
  }

  html[dir="rtl"] .xxlMarginEnd500 {
    margin-left: var(--space-500);
  }

  html:not([dir="rtl"]) .xxlMarginStartN500 {
    margin-left: var(--space-negative-500);
  }

  html:not([dir="rtl"]) .xxlMarginEndN500 {
    margin-right: var(--space-negative-500);
  }

  html[dir="rtl"] .xxlMarginStartN500 {
    margin-right: var(--space-negative-500);
  }

  html[dir="rtl"] .xxlMarginEndN500 {
    margin-left: var(--space-negative-500);
  }

  .xxlMarginTop500 {
    margin-top: var(--space-500);
  }

  .xxlMarginBottom500 {
    margin-bottom: var(--space-500);
  }

  .xxlMarginTopN500 {
    margin-top: var(--space-negative-500);
  }

  .xxlMarginBottomN500 {
    margin-bottom: var(--space-negative-500);
  }

  .xxlPaddingY500 {
    padding-bottom: var(--space-500);
    padding-top: var(--space-500);
  }

  .xxlPaddingX500 {
    padding-left: var(--space-500);
    padding-right: var(--space-500);
  }

  html:not([dir="rtl"]) .xxlMarginStart600 {
    margin-left: var(--space-600);
  }

  html:not([dir="rtl"]) .xxlMarginEnd600 {
    margin-right: var(--space-600);
  }

  html[dir="rtl"] .xxlMarginStart600 {
    margin-right: var(--space-600);
  }

  html[dir="rtl"] .xxlMarginEnd600 {
    margin-left: var(--space-600);
  }

  html:not([dir="rtl"]) .xxlMarginStartN600 {
    margin-left: var(--space-negative-600);
  }

  html:not([dir="rtl"]) .xxlMarginEndN600 {
    margin-right: var(--space-negative-600);
  }

  html[dir="rtl"] .xxlMarginStartN600 {
    margin-right: var(--space-negative-600);
  }

  html[dir="rtl"] .xxlMarginEndN600 {
    margin-left: var(--space-negative-600);
  }

  .xxlMarginTop600 {
    margin-top: var(--space-600);
  }

  .xxlMarginBottom600 {
    margin-bottom: var(--space-600);
  }

  .xxlMarginTopN600 {
    margin-top: var(--space-negative-600);
  }

  .xxlMarginBottomN600 {
    margin-bottom: var(--space-negative-600);
  }

  .xxlPaddingY600 {
    padding-bottom: var(--space-600);
    padding-top: var(--space-600);
  }

  .xxlPaddingX600 {
    padding-left: var(--space-600);
    padding-right: var(--space-600);
  }

  html:not([dir="rtl"]) .xxlMarginStart700 {
    margin-left: var(--space-700);
  }

  html:not([dir="rtl"]) .xxlMarginEnd700 {
    margin-right: var(--space-700);
  }

  html[dir="rtl"] .xxlMarginStart700 {
    margin-right: var(--space-700);
  }

  html[dir="rtl"] .xxlMarginEnd700 {
    margin-left: var(--space-700);
  }

  html:not([dir="rtl"]) .xxlMarginStartN700 {
    margin-left: var(--space-negative-700);
  }

  html:not([dir="rtl"]) .xxlMarginEndN700 {
    margin-right: var(--space-negative-700);
  }

  html[dir="rtl"] .xxlMarginStartN700 {
    margin-right: var(--space-negative-700);
  }

  html[dir="rtl"] .xxlMarginEndN700 {
    margin-left: var(--space-negative-700);
  }

  .xxlMarginTop700 {
    margin-top: var(--space-700);
  }

  .xxlMarginBottom700 {
    margin-bottom: var(--space-700);
  }

  .xxlMarginTopN700 {
    margin-top: var(--space-negative-700);
  }

  .xxlMarginBottomN700 {
    margin-bottom: var(--space-negative-700);
  }

  .xxlPaddingY700 {
    padding-bottom: var(--space-700);
    padding-top: var(--space-700);
  }

  .xxlPaddingX700 {
    padding-left: var(--space-700);
    padding-right: var(--space-700);
  }

  html:not([dir="rtl"]) .xxlMarginStart800 {
    margin-left: var(--space-800);
  }

  html:not([dir="rtl"]) .xxlMarginEnd800 {
    margin-right: var(--space-800);
  }

  html[dir="rtl"] .xxlMarginStart800 {
    margin-right: var(--space-800);
  }

  html[dir="rtl"] .xxlMarginEnd800 {
    margin-left: var(--space-800);
  }

  html:not([dir="rtl"]) .xxlMarginStartN800 {
    margin-left: var(--space-negative-800);
  }

  html:not([dir="rtl"]) .xxlMarginEndN800 {
    margin-right: var(--space-negative-800);
  }

  html[dir="rtl"] .xxlMarginStartN800 {
    margin-right: var(--space-negative-800);
  }

  html[dir="rtl"] .xxlMarginEndN800 {
    margin-left: var(--space-negative-800);
  }

  .xxlMarginTop800 {
    margin-top: var(--space-800);
  }

  .xxlMarginBottom800 {
    margin-bottom: var(--space-800);
  }

  .xxlMarginTopN800 {
    margin-top: var(--space-negative-800);
  }

  .xxlMarginBottomN800 {
    margin-bottom: var(--space-negative-800);
  }

  .xxlPaddingY800 {
    padding-bottom: var(--space-800);
    padding-top: var(--space-800);
  }

  .xxlPaddingX800 {
    padding-left: var(--space-800);
    padding-right: var(--space-800);
  }

  html:not([dir="rtl"]) .xxlMarginStart900 {
    margin-left: var(--space-900);
  }

  html:not([dir="rtl"]) .xxlMarginEnd900 {
    margin-right: var(--space-900);
  }

  html[dir="rtl"] .xxlMarginStart900 {
    margin-right: var(--space-900);
  }

  html[dir="rtl"] .xxlMarginEnd900 {
    margin-left: var(--space-900);
  }

  html:not([dir="rtl"]) .xxlMarginStartN900 {
    margin-left: var(--space-negative-900);
  }

  html:not([dir="rtl"]) .xxlMarginEndN900 {
    margin-right: var(--space-negative-900);
  }

  html[dir="rtl"] .xxlMarginStartN900 {
    margin-right: var(--space-negative-900);
  }

  html[dir="rtl"] .xxlMarginEndN900 {
    margin-left: var(--space-negative-900);
  }

  .xxlMarginTop900 {
    margin-top: var(--space-900);
  }

  .xxlMarginBottom900 {
    margin-bottom: var(--space-900);
  }

  .xxlMarginTopN900 {
    margin-top: var(--space-negative-900);
  }

  .xxlMarginBottomN900 {
    margin-bottom: var(--space-negative-900);
  }

  .xxlPaddingY900 {
    padding-bottom: var(--space-900);
    padding-top: var(--space-900);
  }

  .xxlPaddingX900 {
    padding-left: var(--space-900);
    padding-right: var(--space-900);
  }
}

@media (--g-xxxl) {
  html:not([dir="rtl"]) .xxxlMarginStartAuto {
    margin-left: auto;
  }

  html:not([dir="rtl"]) .xxxlMarginEndAuto {
    margin-right: auto;
  }

  html[dir="rtl"] .xxxlMarginStartAuto {
    margin-right: auto;
  }

  html[dir="rtl"] .xxxlMarginEndAuto {
    margin-left: auto;
  }

  .xxxlMarginTopAuto {
    margin-top: auto;
  }

  .xxxlMarginBottomAuto {
    margin-bottom: auto;
  }
}

@media (--g-xxxl) {
  html:not([dir="rtl"]) .xxxlMarginStart0 {
    margin-left: var(--space-0);
  }

  html:not([dir="rtl"]) .xxxlMarginEnd0 {
    margin-right: var(--space-0);
  }

  html[dir="rtl"] .xxxlMarginStart0 {
    margin-right: var(--space-0);
  }

  html[dir="rtl"] .xxxlMarginEnd0 {
    margin-left: var(--space-0);
  }

  .xxxlMarginTop0 {
    margin-top: var(--space-0);
  }

  .xxxlMarginBottom0 {
    margin-bottom: var(--space-0);
  }

  .xxxlPaddingY0 {
    padding-bottom: var(--space-0);
    padding-top: var(--space-0);
  }

  .xxxlPaddingX0 {
    padding-left: var(--space-0);
    padding-right: var(--space-0);
  }

  html:not([dir="rtl"]) .xxxlMarginStart25 {
    margin-left: 1px;
  }

  html:not([dir="rtl"]) .xxxlMarginEnd25 {
    margin-right: 1px;
  }

  html[dir="rtl"] .xxxlMarginStart25 {
    margin-right: 1px;
  }

  html[dir="rtl"] .xxxlMarginEnd25 {
    margin-left: 1px;
  }

  html:not([dir="rtl"]) .xxxlMarginStartN25 {
    margin-left: -1px;
  }

  html:not([dir="rtl"]) .xxxlMarginEndN25 {
    margin-right: -1px;
  }

  html[dir="rtl"] .xxxlMarginStartN25 {
    margin-right: -1px;
  }

  html[dir="rtl"] .xxxlMarginEndN25 {
    margin-left: -1px;
  }

  .xxxlMarginTop25 {
    margin-top: 1px;
  }

  .xxxlMarginBottom25 {
    margin-bottom: 1px;
  }

  .xxxlMarginTopN25 {
    margin-top: -1px;
  }

  .xxxlMarginBottomN25 {
    margin-bottom: -1px;
  }

  .xxxlPaddingY25 {
    padding-bottom: 1px;
    padding-top: 1px;
  }

  .xxxlPaddingX25 {
    padding-left: 1px;
    padding-right: 1px;
  }

  html:not([dir="rtl"]) .xxxlMarginStart50 {
    margin-left: 2px;
  }

  html:not([dir="rtl"]) .xxxlMarginEnd50 {
    margin-right: 2px;
  }

  html[dir="rtl"] .xxxlMarginStart50 {
    margin-right: 2px;
  }

  html[dir="rtl"] .xxxlMarginEnd50 {
    margin-left: 2px;
  }

  html:not([dir="rtl"]) .xxxlMarginStartN50 {
    margin-left: -2px;
  }

  html:not([dir="rtl"]) .xxxlMarginEndN50 {
    margin-right: -2px;
  }

  html[dir="rtl"] .xxxlMarginStartN50 {
    margin-right: -2px;
  }

  html[dir="rtl"] .xxxlMarginEndN50 {
    margin-left: -2px;
  }

  .xxxlMarginTop50 {
    margin-top: 2px;
  }

  .xxxlMarginBottom50 {
    margin-bottom: 2px;
  }

  .xxxlMarginTopN50 {
    margin-top: -2px;
  }

  .xxxlMarginBottomN50 {
    margin-bottom: -2px;
  }

  .xxxlPaddingY50 {
    padding-bottom: 2px;
    padding-top: 2px;
  }

  .xxxlPaddingX50 {
    padding-left: 2px;
    padding-right: 2px;
  }

  html:not([dir="rtl"]) .xxxlMarginStart100 {
    margin-left: var(--space-100);
  }

  html:not([dir="rtl"]) .xxxlMarginEnd100 {
    margin-right: var(--space-100);
  }

  html[dir="rtl"] .xxxlMarginStart100 {
    margin-right: var(--space-100);
  }

  html[dir="rtl"] .xxxlMarginEnd100 {
    margin-left: var(--space-100);
  }

  html:not([dir="rtl"]) .xxxlMarginStartN100 {
    margin-left: var(--space-negative-100);
  }

  html:not([dir="rtl"]) .xxxlMarginEndN100 {
    margin-right: var(--space-negative-100);
  }

  html[dir="rtl"] .xxxlMarginStartN100 {
    margin-right: var(--space-negative-100);
  }

  html[dir="rtl"] .xxxlMarginEndN100 {
    margin-left: var(--space-negative-100);
  }

  .xxxlMarginTop100 {
    margin-top: var(--space-100);
  }

  .xxxlMarginBottom100 {
    margin-bottom: var(--space-100);
  }

  .xxxlMarginTopN100 {
    margin-top: var(--space-negative-100);
  }

  .xxxlMarginBottomN100 {
    margin-bottom: var(--space-negative-100);
  }

  .xxxlPaddingY100 {
    padding-bottom: var(--space-100);
    padding-top: var(--space-100);
  }

  .xxxlPaddingX100 {
    padding-left: var(--space-100);
    padding-right: var(--space-100);
  }

  html:not([dir="rtl"]) .xxxlMarginStart150 {
    margin-left: 6px;
  }

  html:not([dir="rtl"]) .xxxlMarginEnd150 {
    margin-right: 6px;
  }

  html[dir="rtl"] .xxxlMarginStart150 {
    margin-right: 6px;
  }

  html[dir="rtl"] .xxxlMarginEnd150 {
    margin-left: 6px;
  }

  html:not([dir="rtl"]) .xxxlMarginStartN150 {
    margin-left: -6px;
  }

  html:not([dir="rtl"]) .xxxlMarginEndN150 {
    margin-right: -6px;
  }

  html[dir="rtl"] .xxxlMarginStartN150 {
    margin-right: -6px;
  }

  html[dir="rtl"] .xxxlMarginEndN150 {
    margin-left: -6px;
  }

  .xxxlMarginTop150 {
    margin-top: 6px;
  }

  .xxxlMarginBottom150 {
    margin-bottom: 6px;
  }

  .xxxlMarginTopN150 {
    margin-top: -6px;
  }

  .xxxlMarginBottomN150 {
    margin-bottom: -6px;
  }

  .xxxlPaddingY150 {
    padding-bottom: 6px;
    padding-top: 6px;
  }

  .xxxlPaddingX150 {
    padding-left: 6px;
    padding-right: 6px;
  }

  html:not([dir="rtl"]) .xxxlMarginStart1000 {
    margin-left: var(--space-1000);
  }

  html:not([dir="rtl"]) .xxxlMarginEnd1000 {
    margin-right: var(--space-1000);
  }

  html[dir="rtl"] .xxxlMarginStart1000 {
    margin-right: var(--space-1000);
  }

  html[dir="rtl"] .xxxlMarginEnd1000 {
    margin-left: var(--space-1000);
  }

  html:not([dir="rtl"]) .xxxlMarginStartN1000 {
    margin-left: var(--space-negative-1000);
  }

  html:not([dir="rtl"]) .xxxlMarginEndN1000 {
    margin-right: var(--space-negative-1000);
  }

  html[dir="rtl"] .xxxlMarginStartN1000 {
    margin-right: var(--space-negative-1000);
  }

  html[dir="rtl"] .xxxlMarginEndN1000 {
    margin-left: var(--space-negative-1000);
  }

  .xxxlMarginTop1000 {
    margin-top: var(--space-1000);
  }

  .xxxlMarginBottom1000 {
    margin-bottom: var(--space-1000);
  }

  .xxxlMarginTopN1000 {
    margin-top: var(--space-negative-1000);
  }

  .xxxlMarginBottomN1000 {
    margin-bottom: var(--space-negative-1000);
  }

  .xxxlPaddingY1000 {
    padding-bottom: var(--space-1000);
    padding-top: var(--space-1000);
  }

  .xxxlPaddingX1000 {
    padding-left: var(--space-1000);
    padding-right: var(--space-1000);
  }

  html:not([dir="rtl"]) .xxxlMarginStart1100 {
    margin-left: var(--space-1100);
  }

  html:not([dir="rtl"]) .xxxlMarginEnd1100 {
    margin-right: var(--space-1100);
  }

  html[dir="rtl"] .xxxlMarginStart1100 {
    margin-right: var(--space-1100);
  }

  html[dir="rtl"] .xxxlMarginEnd1100 {
    margin-left: var(--space-1100);
  }

  html:not([dir="rtl"]) .xxxlMarginStartN1100 {
    margin-left: var(--space-negative-1100);
  }

  html:not([dir="rtl"]) .xxxlMarginEndN1100 {
    margin-right: var(--space-negative-1100);
  }

  html[dir="rtl"] .xxxlMarginStartN1100 {
    margin-right: var(--space-negative-1100);
  }

  html[dir="rtl"] .xxxlMarginEndN1100 {
    margin-left: var(--space-negative-1100);
  }

  .xxxlMarginTop1100 {
    margin-top: var(--space-1100);
  }

  .xxxlMarginBottom1100 {
    margin-bottom: var(--space-1100);
  }

  .xxxlMarginTopN1100 {
    margin-top: var(--space-negative-1100);
  }

  .xxxlMarginBottomN1100 {
    margin-bottom: var(--space-negative-1100);
  }

  .xxxlPaddingY1100 {
    padding-bottom: var(--space-1100);
    padding-top: var(--space-1100);
  }

  .xxxlPaddingX1100 {
    padding-left: var(--space-1100);
    padding-right: var(--space-1100);
  }

  html:not([dir="rtl"]) .xxxlMarginStart1200 {
    margin-left: var(--space-1200);
  }

  html:not([dir="rtl"]) .xxxlMarginEnd1200 {
    margin-right: var(--space-1200);
  }

  html[dir="rtl"] .xxxlMarginStart1200 {
    margin-right: var(--space-1200);
  }

  html[dir="rtl"] .xxxlMarginEnd1200 {
    margin-left: var(--space-1200);
  }

  html:not([dir="rtl"]) .xxxlMarginStartN1200 {
    margin-left: var(--space-negative-1200);
  }

  html:not([dir="rtl"]) .xxxlMarginEndN1200 {
    margin-right: var(--space-negative-1200);
  }

  html[dir="rtl"] .xxxlMarginStartN1200 {
    margin-right: var(--space-negative-1200);
  }

  html[dir="rtl"] .xxxlMarginEndN1200 {
    margin-left: var(--space-negative-1200);
  }

  .xxxlMarginTop1200 {
    margin-top: var(--space-1200);
  }

  .xxxlMarginBottom1200 {
    margin-bottom: var(--space-1200);
  }

  .xxxlMarginTopN1200 {
    margin-top: var(--space-negative-1200);
  }

  .xxxlMarginBottomN1200 {
    margin-bottom: var(--space-negative-1200);
  }

  .xxxlPaddingY1200 {
    padding-bottom: var(--space-1200);
    padding-top: var(--space-1200);
  }

  .xxxlPaddingX1200 {
    padding-left: var(--space-1200);
    padding-right: var(--space-1200);
  }

  html:not([dir="rtl"]) .xxxlMarginStart1300 {
    margin-left: var(--space-1300);
  }

  html:not([dir="rtl"]) .xxxlMarginEnd1300 {
    margin-right: var(--space-1300);
  }

  html[dir="rtl"] .xxxlMarginStart1300 {
    margin-right: var(--space-1300);
  }

  html[dir="rtl"] .xxxlMarginEnd1300 {
    margin-left: var(--space-1300);
  }

  html:not([dir="rtl"]) .xxxlMarginStartN1300 {
    margin-left: var(--space-negative-1300);
  }

  html:not([dir="rtl"]) .xxxlMarginEndN1300 {
    margin-right: var(--space-negative-1300);
  }

  html[dir="rtl"] .xxxlMarginStartN1300 {
    margin-right: var(--space-negative-1300);
  }

  html[dir="rtl"] .xxxlMarginEndN1300 {
    margin-left: var(--space-negative-1300);
  }

  .xxxlMarginTop1300 {
    margin-top: var(--space-1300);
  }

  .xxxlMarginBottom1300 {
    margin-bottom: var(--space-1300);
  }

  .xxxlMarginTopN1300 {
    margin-top: var(--space-negative-1300);
  }

  .xxxlMarginBottomN1300 {
    margin-bottom: var(--space-negative-1300);
  }

  .xxxlPaddingY1300 {
    padding-bottom: var(--space-1300);
    padding-top: var(--space-1300);
  }

  .xxxlPaddingX1300 {
    padding-left: var(--space-1300);
    padding-right: var(--space-1300);
  }

  html:not([dir="rtl"]) .xxxlMarginStart1400 {
    margin-left: var(--space-1400);
  }

  html:not([dir="rtl"]) .xxxlMarginEnd1400 {
    margin-right: var(--space-1400);
  }

  html[dir="rtl"] .xxxlMarginStart1400 {
    margin-right: var(--space-1400);
  }

  html[dir="rtl"] .xxxlMarginEnd1400 {
    margin-left: var(--space-1400);
  }

  html:not([dir="rtl"]) .xxxlMarginStartN1400 {
    margin-left: var(--space-negative-1400);
  }

  html:not([dir="rtl"]) .xxxlMarginEndN1400 {
    margin-right: var(--space-negative-1400);
  }

  html[dir="rtl"] .xxxlMarginStartN1400 {
    margin-right: var(--space-negative-1400);
  }

  html[dir="rtl"] .xxxlMarginEndN1400 {
    margin-left: var(--space-negative-1400);
  }

  .xxxlMarginTop1400 {
    margin-top: var(--space-1400);
  }

  .xxxlMarginBottom1400 {
    margin-bottom: var(--space-1400);
  }

  .xxxlMarginTopN1400 {
    margin-top: var(--space-negative-1400);
  }

  .xxxlMarginBottomN1400 {
    margin-bottom: var(--space-negative-1400);
  }

  .xxxlPaddingY1400 {
    padding-bottom: var(--space-1400);
    padding-top: var(--space-1400);
  }

  .xxxlPaddingX1400 {
    padding-left: var(--space-1400);
    padding-right: var(--space-1400);
  }

  html:not([dir="rtl"]) .xxxlMarginStart1500 {
    margin-left: var(--space-1500);
  }

  html:not([dir="rtl"]) .xxxlMarginEnd1500 {
    margin-right: var(--space-1500);
  }

  html[dir="rtl"] .xxxlMarginStart1500 {
    margin-right: var(--space-1500);
  }

  html[dir="rtl"] .xxxlMarginEnd1500 {
    margin-left: var(--space-1500);
  }

  html:not([dir="rtl"]) .xxxlMarginStartN1500 {
    margin-left: var(--space-negative-1500);
  }

  html:not([dir="rtl"]) .xxxlMarginEndN1500 {
    margin-right: var(--space-negative-1500);
  }

  html[dir="rtl"] .xxxlMarginStartN1500 {
    margin-right: var(--space-negative-1500);
  }

  html[dir="rtl"] .xxxlMarginEndN1500 {
    margin-left: var(--space-negative-1500);
  }

  .xxxlMarginTop1500 {
    margin-top: var(--space-1500);
  }

  .xxxlMarginBottom1500 {
    margin-bottom: var(--space-1500);
  }

  .xxxlMarginTopN1500 {
    margin-top: var(--space-negative-1500);
  }

  .xxxlMarginBottomN1500 {
    margin-bottom: var(--space-negative-1500);
  }

  .xxxlPaddingY1500 {
    padding-bottom: var(--space-1500);
    padding-top: var(--space-1500);
  }

  .xxxlPaddingX1500 {
    padding-left: var(--space-1500);
    padding-right: var(--space-1500);
  }

  html:not([dir="rtl"]) .xxxlMarginStart1600 {
    margin-left: var(--space-1600);
  }

  html:not([dir="rtl"]) .xxxlMarginEnd1600 {
    margin-right: var(--space-1600);
  }

  html[dir="rtl"] .xxxlMarginStart1600 {
    margin-right: var(--space-1600);
  }

  html[dir="rtl"] .xxxlMarginEnd1600 {
    margin-left: var(--space-1600);
  }

  html:not([dir="rtl"]) .xxxlMarginStartN1600 {
    margin-left: var(--space-negative-1600);
  }

  html:not([dir="rtl"]) .xxxlMarginEndN1600 {
    margin-right: var(--space-negative-1600);
  }

  html[dir="rtl"] .xxxlMarginStartN1600 {
    margin-right: var(--space-negative-1600);
  }

  html[dir="rtl"] .xxxlMarginEndN1600 {
    margin-left: var(--space-negative-1600);
  }

  .xxxlMarginTop1600 {
    margin-top: var(--space-1600);
  }

  .xxxlMarginBottom1600 {
    margin-bottom: var(--space-1600);
  }

  .xxxlMarginTopN1600 {
    margin-top: var(--space-negative-1600);
  }

  .xxxlMarginBottomN1600 {
    margin-bottom: var(--space-negative-1600);
  }

  .xxxlPaddingY1600 {
    padding-bottom: var(--space-1600);
    padding-top: var(--space-1600);
  }

  .xxxlPaddingX1600 {
    padding-left: var(--space-1600);
    padding-right: var(--space-1600);
  }

  html:not([dir="rtl"]) .xxxlMarginStart200 {
    margin-left: var(--space-200);
  }

  html:not([dir="rtl"]) .xxxlMarginEnd200 {
    margin-right: var(--space-200);
  }

  html[dir="rtl"] .xxxlMarginStart200 {
    margin-right: var(--space-200);
  }

  html[dir="rtl"] .xxxlMarginEnd200 {
    margin-left: var(--space-200);
  }

  html:not([dir="rtl"]) .xxxlMarginStartN200 {
    margin-left: var(--space-negative-200);
  }

  html:not([dir="rtl"]) .xxxlMarginEndN200 {
    margin-right: var(--space-negative-200);
  }

  html[dir="rtl"] .xxxlMarginStartN200 {
    margin-right: var(--space-negative-200);
  }

  html[dir="rtl"] .xxxlMarginEndN200 {
    margin-left: var(--space-negative-200);
  }

  .xxxlMarginTop200 {
    margin-top: var(--space-200);
  }

  .xxxlMarginBottom200 {
    margin-bottom: var(--space-200);
  }

  .xxxlMarginTopN200 {
    margin-top: var(--space-negative-200);
  }

  .xxxlMarginBottomN200 {
    margin-bottom: var(--space-negative-200);
  }

  .xxxlPaddingY200 {
    padding-bottom: var(--space-200);
    padding-top: var(--space-200);
  }

  .xxxlPaddingX200 {
    padding-left: var(--space-200);
    padding-right: var(--space-200);
  }

  html:not([dir="rtl"]) .xxxlMarginStart300 {
    margin-left: var(--space-300);
  }

  html:not([dir="rtl"]) .xxxlMarginEnd300 {
    margin-right: var(--space-300);
  }

  html[dir="rtl"] .xxxlMarginStart300 {
    margin-right: var(--space-300);
  }

  html[dir="rtl"] .xxxlMarginEnd300 {
    margin-left: var(--space-300);
  }

  html:not([dir="rtl"]) .xxxlMarginStartN300 {
    margin-left: var(--space-negative-300);
  }

  html:not([dir="rtl"]) .xxxlMarginEndN300 {
    margin-right: var(--space-negative-300);
  }

  html[dir="rtl"] .xxxlMarginStartN300 {
    margin-right: var(--space-negative-300);
  }

  html[dir="rtl"] .xxxlMarginEndN300 {
    margin-left: var(--space-negative-300);
  }

  .xxxlMarginTop300 {
    margin-top: var(--space-300);
  }

  .xxxlMarginBottom300 {
    margin-bottom: var(--space-300);
  }

  .xxxlMarginTopN300 {
    margin-top: var(--space-negative-300);
  }

  .xxxlMarginBottomN300 {
    margin-bottom: var(--space-negative-300);
  }

  .xxxlPaddingY300 {
    padding-bottom: var(--space-300);
    padding-top: var(--space-300);
  }

  .xxxlPaddingX300 {
    padding-left: var(--space-300);
    padding-right: var(--space-300);
  }

  html:not([dir="rtl"]) .xxxlMarginStart400 {
    margin-left: var(--space-400);
  }

  html:not([dir="rtl"]) .xxxlMarginEnd400 {
    margin-right: var(--space-400);
  }

  html[dir="rtl"] .xxxlMarginStart400 {
    margin-right: var(--space-400);
  }

  html[dir="rtl"] .xxxlMarginEnd400 {
    margin-left: var(--space-400);
  }

  html:not([dir="rtl"]) .xxxlMarginStartN400 {
    margin-left: var(--space-negative-400);
  }

  html:not([dir="rtl"]) .xxxlMarginEndN400 {
    margin-right: var(--space-negative-400);
  }

  html[dir="rtl"] .xxxlMarginStartN400 {
    margin-right: var(--space-negative-400);
  }

  html[dir="rtl"] .xxxlMarginEndN400 {
    margin-left: var(--space-negative-400);
  }

  .xxxlMarginTop400 {
    margin-top: var(--space-400);
  }

  .xxxlMarginBottom400 {
    margin-bottom: var(--space-400);
  }

  .xxxlMarginTopN400 {
    margin-top: var(--space-negative-400);
  }

  .xxxlMarginBottomN400 {
    margin-bottom: var(--space-negative-400);
  }

  .xxxlPaddingY400 {
    padding-bottom: var(--space-400);
    padding-top: var(--space-400);
  }

  .xxxlPaddingX400 {
    padding-left: var(--space-400);
    padding-right: var(--space-400);
  }

  html:not([dir="rtl"]) .xxxlMarginStart500 {
    margin-left: var(--space-500);
  }

  html:not([dir="rtl"]) .xxxlMarginEnd500 {
    margin-right: var(--space-500);
  }

  html[dir="rtl"] .xxxlMarginStart500 {
    margin-right: var(--space-500);
  }

  html[dir="rtl"] .xxxlMarginEnd500 {
    margin-left: var(--space-500);
  }

  html:not([dir="rtl"]) .xxxlMarginStartN500 {
    margin-left: var(--space-negative-500);
  }

  html:not([dir="rtl"]) .xxxlMarginEndN500 {
    margin-right: var(--space-negative-500);
  }

  html[dir="rtl"] .xxxlMarginStartN500 {
    margin-right: var(--space-negative-500);
  }

  html[dir="rtl"] .xxxlMarginEndN500 {
    margin-left: var(--space-negative-500);
  }

  .xxxlMarginTop500 {
    margin-top: var(--space-500);
  }

  .xxxlMarginBottom500 {
    margin-bottom: var(--space-500);
  }

  .xxxlMarginTopN500 {
    margin-top: var(--space-negative-500);
  }

  .xxxlMarginBottomN500 {
    margin-bottom: var(--space-negative-500);
  }

  .xxxlPaddingY500 {
    padding-bottom: var(--space-500);
    padding-top: var(--space-500);
  }

  .xxxlPaddingX500 {
    padding-left: var(--space-500);
    padding-right: var(--space-500);
  }

  html:not([dir="rtl"]) .xxxlMarginStart600 {
    margin-left: var(--space-600);
  }

  html:not([dir="rtl"]) .xxxlMarginEnd600 {
    margin-right: var(--space-600);
  }

  html[dir="rtl"] .xxxlMarginStart600 {
    margin-right: var(--space-600);
  }

  html[dir="rtl"] .xxxlMarginEnd600 {
    margin-left: var(--space-600);
  }

  html:not([dir="rtl"]) .xxxlMarginStartN600 {
    margin-left: var(--space-negative-600);
  }

  html:not([dir="rtl"]) .xxxlMarginEndN600 {
    margin-right: var(--space-negative-600);
  }

  html[dir="rtl"] .xxxlMarginStartN600 {
    margin-right: var(--space-negative-600);
  }

  html[dir="rtl"] .xxxlMarginEndN600 {
    margin-left: var(--space-negative-600);
  }

  .xxxlMarginTop600 {
    margin-top: var(--space-600);
  }

  .xxxlMarginBottom600 {
    margin-bottom: var(--space-600);
  }

  .xxxlMarginTopN600 {
    margin-top: var(--space-negative-600);
  }

  .xxxlMarginBottomN600 {
    margin-bottom: var(--space-negative-600);
  }

  .xxxlPaddingY600 {
    padding-bottom: var(--space-600);
    padding-top: var(--space-600);
  }

  .xxxlPaddingX600 {
    padding-left: var(--space-600);
    padding-right: var(--space-600);
  }

  html:not([dir="rtl"]) .xxxlMarginStart700 {
    margin-left: var(--space-700);
  }

  html:not([dir="rtl"]) .xxxlMarginEnd700 {
    margin-right: var(--space-700);
  }

  html[dir="rtl"] .xxxlMarginStart700 {
    margin-right: var(--space-700);
  }

  html[dir="rtl"] .xxxlMarginEnd700 {
    margin-left: var(--space-700);
  }

  html:not([dir="rtl"]) .xxxlMarginStartN700 {
    margin-left: var(--space-negative-700);
  }

  html:not([dir="rtl"]) .xxxlMarginEndN700 {
    margin-right: var(--space-negative-700);
  }

  html[dir="rtl"] .xxxlMarginStartN700 {
    margin-right: var(--space-negative-700);
  }

  html[dir="rtl"] .xxxlMarginEndN700 {
    margin-left: var(--space-negative-700);
  }

  .xxxlMarginTop700 {
    margin-top: var(--space-700);
  }

  .xxxlMarginBottom700 {
    margin-bottom: var(--space-700);
  }

  .xxxlMarginTopN700 {
    margin-top: var(--space-negative-700);
  }

  .xxxlMarginBottomN700 {
    margin-bottom: var(--space-negative-700);
  }

  .xxxlPaddingY700 {
    padding-bottom: var(--space-700);
    padding-top: var(--space-700);
  }

  .xxxlPaddingX700 {
    padding-left: var(--space-700);
    padding-right: var(--space-700);
  }

  html:not([dir="rtl"]) .xxxlMarginStart800 {
    margin-left: var(--space-800);
  }

  html:not([dir="rtl"]) .xxxlMarginEnd800 {
    margin-right: var(--space-800);
  }

  html[dir="rtl"] .xxxlMarginStart800 {
    margin-right: var(--space-800);
  }

  html[dir="rtl"] .xxxlMarginEnd800 {
    margin-left: var(--space-800);
  }

  html:not([dir="rtl"]) .xxxlMarginStartN800 {
    margin-left: var(--space-negative-800);
  }

  html:not([dir="rtl"]) .xxxlMarginEndN800 {
    margin-right: var(--space-negative-800);
  }

  html[dir="rtl"] .xxxlMarginStartN800 {
    margin-right: var(--space-negative-800);
  }

  html[dir="rtl"] .xxxlMarginEndN800 {
    margin-left: var(--space-negative-800);
  }

  .xxxlMarginTop800 {
    margin-top: var(--space-800);
  }

  .xxxlMarginBottom800 {
    margin-bottom: var(--space-800);
  }

  .xxxlMarginTopN800 {
    margin-top: var(--space-negative-800);
  }

  .xxxlMarginBottomN800 {
    margin-bottom: var(--space-negative-800);
  }

  .xxxlPaddingY800 {
    padding-bottom: var(--space-800);
    padding-top: var(--space-800);
  }

  .xxxlPaddingX800 {
    padding-left: var(--space-800);
    padding-right: var(--space-800);
  }

  html:not([dir="rtl"]) .xxxlMarginStart900 {
    margin-left: var(--space-900);
  }

  html:not([dir="rtl"]) .xxxlMarginEnd900 {
    margin-right: var(--space-900);
  }

  html[dir="rtl"] .xxxlMarginStart900 {
    margin-right: var(--space-900);
  }

  html[dir="rtl"] .xxxlMarginEnd900 {
    margin-left: var(--space-900);
  }

  html:not([dir="rtl"]) .xxxlMarginStartN900 {
    margin-left: var(--space-negative-900);
  }

  html:not([dir="rtl"]) .xxxlMarginEndN900 {
    margin-right: var(--space-negative-900);
  }

  html[dir="rtl"] .xxxlMarginStartN900 {
    margin-right: var(--space-negative-900);
  }

  html[dir="rtl"] .xxxlMarginEndN900 {
    margin-left: var(--space-negative-900);
  }

  .xxxlMarginTop900 {
    margin-top: var(--space-900);
  }

  .xxxlMarginBottom900 {
    margin-bottom: var(--space-900);
  }

  .xxxlMarginTopN900 {
    margin-top: var(--space-negative-900);
  }

  .xxxlMarginBottomN900 {
    margin-bottom: var(--space-negative-900);
  }

  .xxxlPaddingY900 {
    padding-bottom: var(--space-900);
    padding-top: var(--space-900);
  }

  .xxxlPaddingX900 {
    padding-left: var(--space-900);
    padding-right: var(--space-900);
  }
}