/* /Pages/Themes/Index.cshtml.rz.scp.css */
.demo[b-2byttkhgwf]{display:flex;flex-direction:column;gap:var(--spacingVerticalXXL);max-width:72rem;margin-inline:auto;padding:var(--spacingVerticalXXXL) var(--spacingHorizontalXL)}.demo__header[b-2byttkhgwf],.section[b-2byttkhgwf]{display:flex;flex-direction:column}.demo__header[b-2byttkhgwf]{gap:var(--spacingVerticalS)}.demo__subtitle[b-2byttkhgwf]{max-width:60ch;color:var(--colorNeutralForeground2)}.demo code[b-2byttkhgwf]{font-family:var(--fontFamilyMonospace);font-size:var(--fontSizeBase200)}.controls[b-2byttkhgwf]{display:flex;flex-wrap:wrap;align-items:end;gap:var(--spacingHorizontalL) var(--spacingHorizontalXXL);padding:var(--spacingVerticalL) var(--spacingHorizontalL);background:var(--colorNeutralBackground2);border:var(--strokeWidthThin) solid var(--colorNeutralStroke2);border-radius:var(--borderRadiusLarge)}.controls__field[b-2byttkhgwf]{display:flex;flex-direction:column;gap:var(--spacingVerticalXS)}.controls__label[b-2byttkhgwf]{color:var(--colorNeutralForeground3);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightSemibold)}.controls__current[b-2byttkhgwf]{color:var(--colorNeutralForeground2)}.chip[b-2byttkhgwf]{display:inline-block;padding:var(--spacingVerticalXXS) var(--spacingHorizontalSNudge);color:var(--colorBrandForeground1);background:var(--colorBrandBackground2);border-radius:var(--borderRadiusMedium)}.select[b-2byttkhgwf]{min-width:15rem;padding:var(--spacingVerticalSNudge) var(--spacingHorizontalM);color:var(--colorNeutralForeground1);background:var(--colorNeutralBackground1);border:var(--strokeWidthThin) solid var(--colorNeutralStroke1);border-radius:var(--borderRadiusMedium);font-size:var(--fontSizeBase300);cursor:pointer}.select:hover[b-2byttkhgwf]{border-color:var(--colorNeutralStroke1Hover)}.select:focus-visible[b-2byttkhgwf]{outline:var(--strokeWidthThick) solid var(--colorStrokeFocus2);outline-offset:var(--strokeWidthThin)}.grid[b-2byttkhgwf]{display:grid;grid-template-columns:repeat(auto-fit, minmax(16rem, 1fr));gap:var(--spacingHorizontalL)}.card[b-2byttkhgwf]{display:flex;flex-direction:column;gap:var(--spacingVerticalM);padding:var(--spacingVerticalL) var(--spacingHorizontalL);background:var(--colorNeutralCardBackground);border:var(--strokeWidthThin) solid var(--colorNeutralStroke2);border-radius:var(--borderRadiusXLarge);box-shadow:var(--shadow4)}.card__title[b-2byttkhgwf]{color:var(--colorNeutralForeground1);font-size:var(--fontSizeBase400);line-height:var(--lineHeightBase400)}.surfaces[b-2byttkhgwf]{display:flex;flex-direction:column;gap:var(--spacingVerticalXS)}.surface[b-2byttkhgwf]{padding:var(--spacingVerticalM) var(--spacingHorizontalM);color:var(--colorNeutralForeground1);border:var(--strokeWidthThin) solid var(--colorNeutralStroke2);border-radius:var(--borderRadiusMedium);font-size:var(--fontSizeBase200)}.surface--1[b-2byttkhgwf]{background:var(--colorNeutralBackground1)}.surface--2[b-2byttkhgwf]{background:var(--colorNeutralBackground2)}.surface--3[b-2byttkhgwf]{background:var(--colorNeutralBackground3)}.text-1[b-2byttkhgwf]{color:var(--colorNeutralForeground1)}.text-2[b-2byttkhgwf]{color:var(--colorNeutralForeground2)}.text-3[b-2byttkhgwf]{color:var(--colorNeutralForeground3)}.text-disabled[b-2byttkhgwf]{color:var(--colorNeutralForegroundDisabled)}.buttons[b-2byttkhgwf]{display:flex;flex-wrap:wrap;gap:var(--spacingHorizontalS)}.btn[b-2byttkhgwf]{padding:var(--spacingVerticalSNudge) var(--spacingHorizontalL);border:var(--strokeWidthThin) solid rgba(0,0,0,0);border-radius:var(--borderRadiusMedium);font-size:var(--fontSizeBase300);font-weight:var(--fontWeightSemibold);cursor:pointer;transition:background-color var(--durationFaster) var(--curveEasyEase)}.btn:focus-visible[b-2byttkhgwf]{outline:var(--strokeWidthThick) solid var(--colorStrokeFocus2);outline-offset:var(--strokeWidthThin)}.btn:disabled[b-2byttkhgwf]{color:var(--colorNeutralForegroundDisabled);background:var(--colorNeutralBackgroundDisabled);border-color:var(--colorNeutralStrokeDisabled);cursor:not-allowed}.btn--brand[b-2byttkhgwf]{color:var(--colorNeutralForegroundOnBrand);background:var(--colorBrandBackground)}.btn--brand:hover:not(:disabled)[b-2byttkhgwf]{background:var(--colorBrandBackgroundHover)}.btn--brand:active:not(:disabled)[b-2byttkhgwf]{background:var(--colorBrandBackgroundPressed)}.btn--subtle[b-2byttkhgwf]{color:var(--colorNeutralForeground2);background:var(--colorSubtleBackground)}.btn--subtle:hover:not(:disabled)[b-2byttkhgwf]{background:var(--colorSubtleBackgroundHover)}.btn--subtle:active:not(:disabled)[b-2byttkhgwf]{background:var(--colorSubtleBackgroundPressed)}.btn--outline[b-2byttkhgwf]{color:var(--colorNeutralForeground1);background:var(--colorTransparentBackground);border-color:var(--colorNeutralStroke1)}.btn--outline:hover:not(:disabled)[b-2byttkhgwf]{background:var(--colorSubtleBackgroundHover)}.shadows[b-2byttkhgwf]{display:grid;grid-template-columns:repeat(auto-fit, minmax(6rem, 1fr));gap:var(--spacingHorizontalL) var(--spacingHorizontalM);padding-block:var(--spacingVerticalXS)}.shadow-tile[b-2byttkhgwf]{display:grid;place-items:center;min-height:3.5rem;color:var(--colorNeutralForeground3);background:var(--colorNeutralBackground1);border-radius:var(--borderRadiusMedium);font-size:var(--fontSizeBase200)}.section[b-2byttkhgwf]{gap:var(--spacingVerticalM)}.section__title[b-2byttkhgwf]{color:var(--colorNeutralForeground1);font-size:var(--fontSizeBase500);line-height:var(--lineHeightBase500)}.swatches[b-2byttkhgwf]{display:grid;grid-template-columns:repeat(auto-fill, minmax(8rem, 1fr));gap:var(--spacingHorizontalS)}.swatch[b-2byttkhgwf]{padding:var(--spacingVerticalM) var(--spacingHorizontalM);border:var(--strokeWidthThin) solid;border-radius:var(--borderRadiusMedium);font-size:var(--fontSizeBase200);font-weight:var(--fontWeightSemibold)}