/* ../labs/gb/styles/m3.css */
@layer md.sys.color {
  :root {
    color-scheme: light dark;
    --md-sys-color-primary: #6750a4;
    --md-sys-color-on-primary: #fff;
    --md-sys-color-primary-container: #eaddff;
    --md-sys-color-on-primary-container: #4f378b;
    --md-sys-color-primary-fixed: #eaddff;
    --md-sys-color-primary-fixed-dim: #d0bcff;
    --md-sys-color-on-primary-fixed: #21005d;
    --md-sys-color-on-primary-fixed-variant: #4f378b;
    --md-sys-color-secondary: #625b71;
    --md-sys-color-on-secondary: #fff;
    --md-sys-color-secondary-container: #e8def8;
    --md-sys-color-on-secondary-container: #4a4458;
    --md-sys-color-secondary-fixed: #e8def8;
    --md-sys-color-secondary-fixed-dim: #ccc2dc;
    --md-sys-color-on-secondary-fixed: #1d192b;
    --md-sys-color-on-secondary-fixed-variant: #4a4458;
    --md-sys-color-tertiary: #7d5260;
    --md-sys-color-on-tertiary: #fff;
    --md-sys-color-tertiary-container: #ffd8e4;
    --md-sys-color-on-tertiary-container: #633b48;
    --md-sys-color-tertiary-fixed: #ffd8e4;
    --md-sys-color-tertiary-fixed-dim: #efb8c8;
    --md-sys-color-on-tertiary-fixed: #31111d;
    --md-sys-color-on-tertiary-fixed-variant: #633b48;
    --md-sys-color-error: #b3261e;
    --md-sys-color-on-error: #fff;
    --md-sys-color-error-container: #f9dedc;
    --md-sys-color-on-error-container: #8c1d18;
    --md-sys-color-surface: #fef7ff;
    --md-sys-color-surface-dim: #ded8e1;
    --md-sys-color-surface-bright: #fef7ff;
    --md-sys-color-surface-container-lowest: #fff;
    --md-sys-color-surface-container-low: #f7f2fa;
    --md-sys-color-surface-container: #f3edf7;
    --md-sys-color-surface-container-high: #ece6f0;
    --md-sys-color-surface-container-highest: #e6e0e9;
    --md-sys-color-on-surface: #1d1b20;
    --md-sys-color-on-surface-variant: #49454f;
    --md-sys-color-outline: #79747e;
    --md-sys-color-outline-variant: #cac4d0;
    --md-sys-color-inverse-surface: #322f35;
    --md-sys-color-inverse-on-surface: #f5eff7;
    --md-sys-color-inverse-primary: #d0bcff;
    --md-sys-color-scrim: #000;
    --md-sys-color-shadow: #000;
  }
  @media (prefers-color-scheme: dark) {
    :root {
      --md-sys-color-primary: #d0bcff;
      --md-sys-color-on-primary: #381e72;
      --md-sys-color-primary-container: #4f378b;
      --md-sys-color-on-primary-container: #eaddff;
      --md-sys-color-secondary: #ccc2dc;
      --md-sys-color-on-secondary: #332d41;
      --md-sys-color-secondary-container: #4a4458;
      --md-sys-color-on-secondary-container: #e8def8;
      --md-sys-color-tertiary: #efb8c8;
      --md-sys-color-on-tertiary: #492532;
      --md-sys-color-tertiary-container: #633b48;
      --md-sys-color-on-tertiary-container: #ffd8e4;
      --md-sys-color-error: #f2b8b5;
      --md-sys-color-on-error: #601410;
      --md-sys-color-error-container: #8c1d18;
      --md-sys-color-on-error-container: #f9dedc;
      --md-sys-color-surface: #141218;
      --md-sys-color-surface-dim: #141218;
      --md-sys-color-surface-bright: #3b383e;
      --md-sys-color-surface-container-lowest: #0f0d13;
      --md-sys-color-surface-container-low: #1d1b20;
      --md-sys-color-surface-container: #211f26;
      --md-sys-color-surface-container-high: #2b2930;
      --md-sys-color-surface-container-highest: #36343b;
      --md-sys-color-on-surface: #e6e0e9;
      --md-sys-color-on-surface-variant: #cac4d0;
      --md-sys-color-outline: #938f99;
      --md-sys-color-outline-variant: #49454f;
      --md-sys-color-inverse-surface: #e6e0e9;
      --md-sys-color-inverse-on-surface: #322f35;
      --md-sys-color-inverse-primary: #6750a4;
    }
  }
  @supports (color: light-dark(#000, #fff)) {
    :root {
      --md-sys-color-primary: light-dark(#6750a4, #d0bcff);
      --md-sys-color-on-primary: light-dark(#fff, #381e72);
      --md-sys-color-primary-container: light-dark(#eaddff, #4f378b);
      --md-sys-color-on-primary-container: light-dark(#4f378b, #eaddff);
      --md-sys-color-secondary: light-dark(#625b71, #ccc2dc);
      --md-sys-color-on-secondary: light-dark(#fff, #332d41);
      --md-sys-color-secondary-container: light-dark(#e8def8, #4a4458);
      --md-sys-color-on-secondary-container: light-dark(#4a4458, #e8def8);
      --md-sys-color-tertiary: light-dark(#7d5260, #efb8c8);
      --md-sys-color-on-tertiary: light-dark(#fff, #492532);
      --md-sys-color-tertiary-container: light-dark(#ffd8e4, #633b48);
      --md-sys-color-on-tertiary-container: light-dark(#633b48, #ffd8e4);
      --md-sys-color-error: light-dark(#b3261e, #f2b8b5);
      --md-sys-color-on-error: light-dark(#fff, #601410);
      --md-sys-color-error-container: light-dark(#f9dedc, #8c1d18);
      --md-sys-color-on-error-container: light-dark(#8c1d18, #f9dedc);
      --md-sys-color-surface: light-dark(#fef7ff, #141218);
      --md-sys-color-surface-dim: light-dark(#ded8e1, #141218);
      --md-sys-color-surface-bright: light-dark(#fef7ff, #3b383e);
      --md-sys-color-surface-container-lowest: light-dark(#fff, #0f0d13);
      --md-sys-color-surface-container-low: light-dark(#f7f2fa, #1d1b20);
      --md-sys-color-surface-container: light-dark(#f3edf7, #211f26);
      --md-sys-color-surface-container-high: light-dark(#ece6f0, #2b2930);
      --md-sys-color-surface-container-highest: light-dark(#e6e0e9, #36343b);
      --md-sys-color-on-surface: light-dark(#1d1b20, #e6e0e9);
      --md-sys-color-on-surface-variant: light-dark(#49454f, #cac4d0);
      --md-sys-color-outline: light-dark(#79747e, #938f99);
      --md-sys-color-outline-variant: light-dark(#cac4d0, #49454f);
      --md-sys-color-inverse-surface: light-dark(#322f35, #e6e0e9);
      --md-sys-color-inverse-on-surface: light-dark(#f5eff7, #322f35);
      --md-sys-color-inverse-primary: light-dark(#d0bcff, #6750a4);
    }
  }
}
@layer md.sys.color {
  @media (prefers-contrast: more) {
    :root {
      --md-sys-color-primary: #381e72;
      --md-sys-color-on-primary: #fff;
      --md-sys-color-primary-container: #4f378b;
      --md-sys-color-on-primary-container: #fff;
      --md-sys-color-primary-fixed: #4f378b;
      --md-sys-color-primary-fixed-dim: #381e72;
      --md-sys-color-on-primary-fixed: #fff;
      --md-sys-color-on-primary-fixed-variant: #fff;
      --md-sys-color-secondary: #332d41;
      --md-sys-color-on-secondary: #fff;
      --md-sys-color-secondary-container: #4a4458;
      --md-sys-color-on-secondary-container: #fff;
      --md-sys-color-secondary-fixed: #4a4458;
      --md-sys-color-secondary-fixed-dim: #332d41;
      --md-sys-color-on-secondary-fixed: #fff;
      --md-sys-color-on-secondary-fixed-variant: #fff;
      --md-sys-color-tertiary: #492532;
      --md-sys-color-on-tertiary: #fff;
      --md-sys-color-tertiary-container: #633b48;
      --md-sys-color-on-tertiary-container: #fff;
      --md-sys-color-tertiary-fixed: #633b48;
      --md-sys-color-tertiary-fixed-dim: #492532;
      --md-sys-color-on-tertiary-fixed: #fff;
      --md-sys-color-on-tertiary-fixed-variant: #fff;
      --md-sys-color-error: #601410;
      --md-sys-color-on-error: #fff;
      --md-sys-color-error-container: #8c1d18;
      --md-sys-color-on-error-container: #fff;
      --md-sys-color-surface: #fef7ff;
      --md-sys-color-surface-dim: #ded8e1;
      --md-sys-color-surface-bright: #fef7ff;
      --md-sys-color-surface-container-lowest: #fff;
      --md-sys-color-surface-container-low: #f7f2fa;
      --md-sys-color-surface-container: #f3edf7;
      --md-sys-color-surface-container-high: #ece6f0;
      --md-sys-color-surface-container-highest: #e6e0e9;
      --md-sys-color-on-surface: #000;
      --md-sys-color-on-surface-variant: #000;
      --md-sys-color-outline: #322f37;
      --md-sys-color-outline-variant: #49454f;
      --md-sys-color-inverse-surface: #322f35;
      --md-sys-color-inverse-on-surface: #fff;
      --md-sys-color-inverse-primary: #d0bcff;
      --md-sys-color-scrim: #000;
      --md-sys-color-shadow: #000;
    }
  }
  @media (prefers-contrast: more) and (prefers-color-scheme: dark) {
    :root {
      --md-sys-color-primary: #f6edff;
      --md-sys-color-on-primary: #000;
      --md-sys-color-primary-container: #d0bcff;
      --md-sys-color-on-primary-container: #000;
      --md-sys-color-primary-fixed: #eaddff;
      --md-sys-color-primary-fixed-dim: #d0bcff;
      --md-sys-color-on-primary-fixed: #000;
      --md-sys-color-on-primary-fixed-variant: #000;
      --md-sys-color-secondary: #f6edff;
      --md-sys-color-on-secondary: #000;
      --md-sys-color-secondary-container: #ccc2dc;
      --md-sys-color-on-secondary-container: #000;
      --md-sys-color-secondary-fixed: #e8def8;
      --md-sys-color-secondary-fixed-dim: #ccc2dc;
      --md-sys-color-on-secondary-fixed: #000;
      --md-sys-color-on-secondary-fixed-variant: #000;
      --md-sys-color-tertiary: #ffecf1;
      --md-sys-color-on-tertiary: #000;
      --md-sys-color-tertiary-container: #efb8c8;
      --md-sys-color-on-tertiary-container: #000;
      --md-sys-color-tertiary-fixed: #ffd8e4;
      --md-sys-color-tertiary-fixed-dim: #efb8c8;
      --md-sys-color-on-tertiary-fixed: #000;
      --md-sys-color-on-tertiary-fixed-variant: #000;
      --md-sys-color-error: #fceeee;
      --md-sys-color-on-error: #000;
      --md-sys-color-error-container: #f2b8b5;
      --md-sys-color-on-error-container: #000;
      --md-sys-color-surface: #141218;
      --md-sys-color-surface-dim: #141218;
      --md-sys-color-surface-bright: #3b383e;
      --md-sys-color-surface-container-lowest: #0f0d13;
      --md-sys-color-surface-container-low: #1d1b20;
      --md-sys-color-surface-container: #211f26;
      --md-sys-color-surface-container-high: #2b2930;
      --md-sys-color-surface-container-highest: #36343b;
      --md-sys-color-on-surface: #fff;
      --md-sys-color-on-surface-variant: #fff;
      --md-sys-color-outline: #f5eefa;
      --md-sys-color-outline-variant: #cac4d0;
      --md-sys-color-inverse-surface: #e6e0e9;
      --md-sys-color-inverse-on-surface: #000;
      --md-sys-color-inverse-primary: #381e72;
    }
  }
  @media (prefers-contrast: more) {
    @supports (color: light-dark(#000, #fff)) {
      :root {
        --md-sys-color-primary: light-dark(#381e72, #f6edff);
        --md-sys-color-on-primary: light-dark(#fff, #000);
        --md-sys-color-primary-container: light-dark(#4f378b, #d0bcff);
        --md-sys-color-on-primary-container: light-dark(#fff, #000);
        --md-sys-color-primary-fixed: light-dark(#4f378b, #eaddff);
        --md-sys-color-primary-fixed-dim: light-dark(#381e72, #d0bcff);
        --md-sys-color-on-primary-fixed: light-dark(#fff, #000);
        --md-sys-color-on-primary-fixed-variant: light-dark(#fff, #000);
        --md-sys-color-secondary: light-dark(#332d41, #f6edff);
        --md-sys-color-on-secondary: light-dark(#fff, #000);
        --md-sys-color-secondary-container: light-dark(#4a4458, #ccc2dc);
        --md-sys-color-on-secondary-container: light-dark(#fff, #000);
        --md-sys-color-secondary-fixed: light-dark(#4a4458, #e8def8);
        --md-sys-color-secondary-fixed-dim: light-dark(#332d41, #ccc2dc);
        --md-sys-color-on-secondary-fixed: light-dark(#fff, #000);
        --md-sys-color-on-secondary-fixed-variant: light-dark(#fff, #000);
        --md-sys-color-tertiary: light-dark(#492532, #ffecf1);
        --md-sys-color-on-tertiary: light-dark(#fff, #000);
        --md-sys-color-tertiary-container: light-dark(#633b48, #efb8c8);
        --md-sys-color-on-tertiary-container: light-dark(#fff, #000);
        --md-sys-color-tertiary-fixed: light-dark(#633b48, #ffd8e4);
        --md-sys-color-tertiary-fixed-dim: light-dark(#492532, #efb8c8);
        --md-sys-color-on-tertiary-fixed: light-dark(#fff, #000);
        --md-sys-color-on-tertiary-fixed-variant: light-dark(#fff, #000);
        --md-sys-color-error: light-dark(#601410, #fceeee);
        --md-sys-color-on-error: light-dark(#fff, #000);
        --md-sys-color-error-container: light-dark(#8c1d18, #f2b8b5);
        --md-sys-color-on-error-container: light-dark(#fff, #000);
        --md-sys-color-surface: light-dark(#fef7ff, #141218);
        --md-sys-color-surface-dim: light-dark(#ded8e1, #141218);
        --md-sys-color-surface-bright: light-dark(#fef7ff, #3b383e);
        --md-sys-color-surface-container-lowest: light-dark(#fff, #0f0d13);
        --md-sys-color-surface-container-low: light-dark(#f7f2fa, #1d1b20);
        --md-sys-color-surface-container: light-dark(#f3edf7, #211f26);
        --md-sys-color-surface-container-high: light-dark(#ece6f0, #2b2930);
        --md-sys-color-surface-container-highest: light-dark(#e6e0e9, #36343b);
        --md-sys-color-on-surface: light-dark(#000, #fff);
        --md-sys-color-on-surface-variant: light-dark(#000, #fff);
        --md-sys-color-outline: light-dark(#322f37, #f5eefa);
        --md-sys-color-outline-variant: light-dark(#49454f, #cac4d0);
        --md-sys-color-inverse-surface: light-dark(#322f35, #e6e0e9);
        --md-sys-color-inverse-on-surface: light-dark(#fff, #000);
        --md-sys-color-inverse-primary: light-dark(#d0bcff, #381e72);
      }
    }
  }
  .md-contrast-standard {
    --md-sys-color-primary: #6750a4;
    --md-sys-color-on-primary: #fff;
    --md-sys-color-primary-container: #eaddff;
    --md-sys-color-on-primary-container: #4f378b;
    --md-sys-color-primary-fixed: #eaddff;
    --md-sys-color-primary-fixed-dim: #d0bcff;
    --md-sys-color-on-primary-fixed: #21005d;
    --md-sys-color-on-primary-fixed-variant: #4f378b;
    --md-sys-color-secondary: #625b71;
    --md-sys-color-on-secondary: #fff;
    --md-sys-color-secondary-container: #e8def8;
    --md-sys-color-on-secondary-container: #4a4458;
    --md-sys-color-secondary-fixed: #e8def8;
    --md-sys-color-secondary-fixed-dim: #ccc2dc;
    --md-sys-color-on-secondary-fixed: #1d192b;
    --md-sys-color-on-secondary-fixed-variant: #4a4458;
    --md-sys-color-tertiary: #7d5260;
    --md-sys-color-on-tertiary: #fff;
    --md-sys-color-tertiary-container: #ffd8e4;
    --md-sys-color-on-tertiary-container: #633b48;
    --md-sys-color-tertiary-fixed: #ffd8e4;
    --md-sys-color-tertiary-fixed-dim: #efb8c8;
    --md-sys-color-on-tertiary-fixed: #31111d;
    --md-sys-color-on-tertiary-fixed-variant: #633b48;
    --md-sys-color-error: #b3261e;
    --md-sys-color-on-error: #fff;
    --md-sys-color-error-container: #f9dedc;
    --md-sys-color-on-error-container: #8c1d18;
    --md-sys-color-surface: #fef7ff;
    --md-sys-color-surface-dim: #ded8e1;
    --md-sys-color-surface-bright: #fef7ff;
    --md-sys-color-surface-container-lowest: #fff;
    --md-sys-color-surface-container-low: #f7f2fa;
    --md-sys-color-surface-container: #f3edf7;
    --md-sys-color-surface-container-high: #ece6f0;
    --md-sys-color-surface-container-highest: #e6e0e9;
    --md-sys-color-on-surface: #1d1b20;
    --md-sys-color-on-surface-variant: #49454f;
    --md-sys-color-outline: #79747e;
    --md-sys-color-outline-variant: #cac4d0;
    --md-sys-color-inverse-surface: #322f35;
    --md-sys-color-inverse-on-surface: #f5eff7;
    --md-sys-color-inverse-primary: #d0bcff;
    --md-sys-color-scrim: #000;
    --md-sys-color-shadow: #000;
  }
  @media (prefers-color-scheme: dark) {
    .md-contrast-standard {
      --md-sys-color-primary: #d0bcff;
      --md-sys-color-on-primary: #381e72;
      --md-sys-color-primary-container: #4f378b;
      --md-sys-color-on-primary-container: #eaddff;
      --md-sys-color-secondary: #ccc2dc;
      --md-sys-color-on-secondary: #332d41;
      --md-sys-color-secondary-container: #4a4458;
      --md-sys-color-on-secondary-container: #e8def8;
      --md-sys-color-tertiary: #efb8c8;
      --md-sys-color-on-tertiary: #492532;
      --md-sys-color-tertiary-container: #633b48;
      --md-sys-color-on-tertiary-container: #ffd8e4;
      --md-sys-color-error: #f2b8b5;
      --md-sys-color-on-error: #601410;
      --md-sys-color-error-container: #8c1d18;
      --md-sys-color-on-error-container: #f9dedc;
      --md-sys-color-surface: #141218;
      --md-sys-color-surface-dim: #141218;
      --md-sys-color-surface-bright: #3b383e;
      --md-sys-color-surface-container-lowest: #0f0d13;
      --md-sys-color-surface-container-low: #1d1b20;
      --md-sys-color-surface-container: #211f26;
      --md-sys-color-surface-container-high: #2b2930;
      --md-sys-color-surface-container-highest: #36343b;
      --md-sys-color-on-surface: #e6e0e9;
      --md-sys-color-on-surface-variant: #cac4d0;
      --md-sys-color-outline: #938f99;
      --md-sys-color-outline-variant: #49454f;
      --md-sys-color-inverse-surface: #e6e0e9;
      --md-sys-color-inverse-on-surface: #322f35;
      --md-sys-color-inverse-primary: #6750a4;
    }
  }
  @supports (color: light-dark(#000, #fff)) {
    .md-contrast-standard {
      --md-sys-color-primary: light-dark(#6750a4, #d0bcff);
      --md-sys-color-on-primary: light-dark(#fff, #381e72);
      --md-sys-color-primary-container: light-dark(#eaddff, #4f378b);
      --md-sys-color-on-primary-container: light-dark(#4f378b, #eaddff);
      --md-sys-color-secondary: light-dark(#625b71, #ccc2dc);
      --md-sys-color-on-secondary: light-dark(#fff, #332d41);
      --md-sys-color-secondary-container: light-dark(#e8def8, #4a4458);
      --md-sys-color-on-secondary-container: light-dark(#4a4458, #e8def8);
      --md-sys-color-tertiary: light-dark(#7d5260, #efb8c8);
      --md-sys-color-on-tertiary: light-dark(#fff, #492532);
      --md-sys-color-tertiary-container: light-dark(#ffd8e4, #633b48);
      --md-sys-color-on-tertiary-container: light-dark(#633b48, #ffd8e4);
      --md-sys-color-error: light-dark(#b3261e, #f2b8b5);
      --md-sys-color-on-error: light-dark(#fff, #601410);
      --md-sys-color-error-container: light-dark(#f9dedc, #8c1d18);
      --md-sys-color-on-error-container: light-dark(#8c1d18, #f9dedc);
      --md-sys-color-surface: light-dark(#fef7ff, #141218);
      --md-sys-color-surface-dim: light-dark(#ded8e1, #141218);
      --md-sys-color-surface-bright: light-dark(#fef7ff, #3b383e);
      --md-sys-color-surface-container-lowest: light-dark(#fff, #0f0d13);
      --md-sys-color-surface-container-low: light-dark(#f7f2fa, #1d1b20);
      --md-sys-color-surface-container: light-dark(#f3edf7, #211f26);
      --md-sys-color-surface-container-high: light-dark(#ece6f0, #2b2930);
      --md-sys-color-surface-container-highest: light-dark(#e6e0e9, #36343b);
      --md-sys-color-on-surface: light-dark(#1d1b20, #e6e0e9);
      --md-sys-color-on-surface-variant: light-dark(#49454f, #cac4d0);
      --md-sys-color-outline: light-dark(#79747e, #938f99);
      --md-sys-color-outline-variant: light-dark(#cac4d0, #49454f);
      --md-sys-color-inverse-surface: light-dark(#322f35, #e6e0e9);
      --md-sys-color-inverse-on-surface: light-dark(#f5eff7, #322f35);
      --md-sys-color-inverse-primary: light-dark(#d0bcff, #6750a4);
    }
  }
  .md-contrast-medium {
    --md-sys-color-primary: #4f378b;
    --md-sys-color-on-primary: #fff;
    --md-sys-color-primary-container: #6750a4;
    --md-sys-color-on-primary-container: #fff;
    --md-sys-color-primary-fixed: #6750a4;
    --md-sys-color-primary-fixed-dim: #4f378b;
    --md-sys-color-on-primary-fixed: #fff;
    --md-sys-color-on-primary-fixed-variant: #fff;
    --md-sys-color-secondary: #4a4458;
    --md-sys-color-on-secondary: #fff;
    --md-sys-color-secondary-container: #625b71;
    --md-sys-color-on-secondary-container: #fff;
    --md-sys-color-secondary-fixed: #625b71;
    --md-sys-color-secondary-fixed-dim: #4a4458;
    --md-sys-color-on-secondary-fixed: #fff;
    --md-sys-color-on-secondary-fixed-variant: #fff;
    --md-sys-color-tertiary: #633b48;
    --md-sys-color-on-tertiary: #fff;
    --md-sys-color-tertiary-container: #7d5260;
    --md-sys-color-on-tertiary-container: #fff;
    --md-sys-color-tertiary-fixed: #7d5260;
    --md-sys-color-tertiary-fixed-dim: #633b48;
    --md-sys-color-on-tertiary-fixed: #fff;
    --md-sys-color-on-tertiary-fixed-variant: #fff;
    --md-sys-color-error: #8c1d18;
    --md-sys-color-on-error: #fff;
    --md-sys-color-error-container: #b3261e;
    --md-sys-color-on-error-container: #fff;
    --md-sys-color-surface: #fef7ff;
    --md-sys-color-surface-dim: #ded8e1;
    --md-sys-color-surface-bright: #fef7ff;
    --md-sys-color-surface-container-lowest: #fff;
    --md-sys-color-surface-container-low: #f7f2fa;
    --md-sys-color-surface-container: #f3edf7;
    --md-sys-color-surface-container-high: #ece6f0;
    --md-sys-color-surface-container-highest: #e6e0e9;
    --md-sys-color-on-surface: #000;
    --md-sys-color-on-surface-variant: #322f37;
    --md-sys-color-outline: #49454f;
    --md-sys-color-outline-variant: #79747e;
    --md-sys-color-inverse-surface: #322f35;
    --md-sys-color-inverse-on-surface: #fff;
    --md-sys-color-inverse-primary: #d0bcff;
    --md-sys-color-scrim: #000;
    --md-sys-color-shadow: #000;
  }
  @media (prefers-color-scheme: dark) {
    .md-contrast-medium {
      --md-sys-color-primary: #eaddff;
      --md-sys-color-on-primary: #21005d;
      --md-sys-color-primary-container: #9a82db;
      --md-sys-color-on-primary-container: #000;
      --md-sys-color-primary-fixed: #eaddff;
      --md-sys-color-primary-fixed-dim: #d0bcff;
      --md-sys-color-on-primary-fixed: #000;
      --md-sys-color-on-primary-fixed-variant: #381e72;
      --md-sys-color-secondary: #e8def8;
      --md-sys-color-on-secondary: #1d192b;
      --md-sys-color-secondary-container: #958da5;
      --md-sys-color-on-secondary-container: #000;
      --md-sys-color-secondary-fixed: #e8def8;
      --md-sys-color-secondary-fixed-dim: #ccc2dc;
      --md-sys-color-on-secondary-fixed: #000;
      --md-sys-color-on-secondary-fixed-variant: #332d41;
      --md-sys-color-tertiary: #ffd8e4;
      --md-sys-color-on-tertiary: #31111d;
      --md-sys-color-tertiary-container: #b58392;
      --md-sys-color-on-tertiary-container: #000;
      --md-sys-color-tertiary-fixed: #ffd8e4;
      --md-sys-color-tertiary-fixed-dim: #efb8c8;
      --md-sys-color-on-tertiary-fixed: #000;
      --md-sys-color-on-tertiary-fixed-variant: #492532;
      --md-sys-color-error: #f9dedc;
      --md-sys-color-on-error: #410e0b;
      --md-sys-color-error-container: #e46962;
      --md-sys-color-on-error-container: #000;
      --md-sys-color-surface: #141218;
      --md-sys-color-surface-dim: #141218;
      --md-sys-color-surface-bright: #3b383e;
      --md-sys-color-surface-container-lowest: #0f0d13;
      --md-sys-color-surface-container-low: #1d1b20;
      --md-sys-color-surface-container: #211f26;
      --md-sys-color-surface-container-high: #2b2930;
      --md-sys-color-surface-container-highest: #36343b;
      --md-sys-color-on-surface: #fff;
      --md-sys-color-on-surface-variant: #e7e0ec;
      --md-sys-color-outline: #aea9b4;
      --md-sys-color-outline-variant: #938f99;
      --md-sys-color-inverse-surface: #e6e0e9;
      --md-sys-color-inverse-on-surface: #1d1b20;
      --md-sys-color-inverse-primary: #4f378b;
    }
  }
  @supports (color: light-dark(#000, #fff)) {
    .md-contrast-medium {
      --md-sys-color-primary: light-dark(#4f378b, #eaddff);
      --md-sys-color-on-primary: light-dark(#fff, #21005d);
      --md-sys-color-primary-container: light-dark(#6750a4, #9a82db);
      --md-sys-color-on-primary-container: light-dark(#fff, #000);
      --md-sys-color-primary-fixed: light-dark(#6750a4, #eaddff);
      --md-sys-color-primary-fixed-dim: light-dark(#4f378b, #d0bcff);
      --md-sys-color-on-primary-fixed: light-dark(#fff, #000);
      --md-sys-color-on-primary-fixed-variant: light-dark(#fff, #381e72);
      --md-sys-color-secondary: light-dark(#4a4458, #e8def8);
      --md-sys-color-on-secondary: light-dark(#fff, #1d192b);
      --md-sys-color-secondary-container: light-dark(#625b71, #958da5);
      --md-sys-color-on-secondary-container: light-dark(#fff, #000);
      --md-sys-color-secondary-fixed: light-dark(#625b71, #e8def8);
      --md-sys-color-secondary-fixed-dim: light-dark(#4a4458, #ccc2dc);
      --md-sys-color-on-secondary-fixed: light-dark(#fff, #000);
      --md-sys-color-on-secondary-fixed-variant: light-dark(#fff, #332d41);
      --md-sys-color-tertiary: light-dark(#633b48, #ffd8e4);
      --md-sys-color-on-tertiary: light-dark(#fff, #31111d);
      --md-sys-color-tertiary-container: light-dark(#7d5260, #b58392);
      --md-sys-color-on-tertiary-container: light-dark(#fff, #000);
      --md-sys-color-tertiary-fixed: light-dark(#7d5260, #ffd8e4);
      --md-sys-color-tertiary-fixed-dim: light-dark(#633b48, #efb8c8);
      --md-sys-color-on-tertiary-fixed: light-dark(#fff, #000);
      --md-sys-color-on-tertiary-fixed-variant: light-dark(#fff, #492532);
      --md-sys-color-error: light-dark(#8c1d18, #f9dedc);
      --md-sys-color-on-error: light-dark(#fff, #410e0b);
      --md-sys-color-error-container: light-dark(#b3261e, #e46962);
      --md-sys-color-on-error-container: light-dark(#fff, #000);
      --md-sys-color-surface: light-dark(#fef7ff, #141218);
      --md-sys-color-surface-dim: light-dark(#ded8e1, #141218);
      --md-sys-color-surface-bright: light-dark(#fef7ff, #3b383e);
      --md-sys-color-surface-container-lowest: light-dark(#fff, #0f0d13);
      --md-sys-color-surface-container-low: light-dark(#f7f2fa, #1d1b20);
      --md-sys-color-surface-container: light-dark(#f3edf7, #211f26);
      --md-sys-color-surface-container-high: light-dark(#ece6f0, #2b2930);
      --md-sys-color-surface-container-highest: light-dark(#e6e0e9, #36343b);
      --md-sys-color-on-surface: light-dark(#000, #fff);
      --md-sys-color-on-surface-variant: light-dark(#322f37, #e7e0ec);
      --md-sys-color-outline: light-dark(#49454f, #aea9b4);
      --md-sys-color-outline-variant: light-dark(#79747e, #938f99);
      --md-sys-color-inverse-surface: light-dark(#322f35, #e6e0e9);
      --md-sys-color-inverse-on-surface: light-dark(#fff, #1d1b20);
      --md-sys-color-inverse-primary: light-dark(#d0bcff, #4f378b);
    }
  }
  .md-contrast-high {
    --md-sys-color-primary: #381e72;
    --md-sys-color-on-primary: #fff;
    --md-sys-color-primary-container: #4f378b;
    --md-sys-color-on-primary-container: #fff;
    --md-sys-color-primary-fixed: #4f378b;
    --md-sys-color-primary-fixed-dim: #381e72;
    --md-sys-color-on-primary-fixed: #fff;
    --md-sys-color-on-primary-fixed-variant: #fff;
    --md-sys-color-secondary: #332d41;
    --md-sys-color-on-secondary: #fff;
    --md-sys-color-secondary-container: #4a4458;
    --md-sys-color-on-secondary-container: #fff;
    --md-sys-color-secondary-fixed: #4a4458;
    --md-sys-color-secondary-fixed-dim: #332d41;
    --md-sys-color-on-secondary-fixed: #fff;
    --md-sys-color-on-secondary-fixed-variant: #fff;
    --md-sys-color-tertiary: #492532;
    --md-sys-color-on-tertiary: #fff;
    --md-sys-color-tertiary-container: #633b48;
    --md-sys-color-on-tertiary-container: #fff;
    --md-sys-color-tertiary-fixed: #633b48;
    --md-sys-color-tertiary-fixed-dim: #492532;
    --md-sys-color-on-tertiary-fixed: #fff;
    --md-sys-color-on-tertiary-fixed-variant: #fff;
    --md-sys-color-error: #601410;
    --md-sys-color-on-error: #fff;
    --md-sys-color-error-container: #8c1d18;
    --md-sys-color-on-error-container: #fff;
    --md-sys-color-surface: #fef7ff;
    --md-sys-color-surface-dim: #ded8e1;
    --md-sys-color-surface-bright: #fef7ff;
    --md-sys-color-surface-container-lowest: #fff;
    --md-sys-color-surface-container-low: #f7f2fa;
    --md-sys-color-surface-container: #f3edf7;
    --md-sys-color-surface-container-high: #ece6f0;
    --md-sys-color-surface-container-highest: #e6e0e9;
    --md-sys-color-on-surface: #000;
    --md-sys-color-on-surface-variant: #000;
    --md-sys-color-outline: #322f37;
    --md-sys-color-outline-variant: #49454f;
    --md-sys-color-inverse-surface: #322f35;
    --md-sys-color-inverse-on-surface: #fff;
    --md-sys-color-inverse-primary: #d0bcff;
    --md-sys-color-scrim: #000;
    --md-sys-color-shadow: #000;
  }
  @media (prefers-color-scheme: dark) {
    .md-contrast-high {
      --md-sys-color-primary: #f6edff;
      --md-sys-color-on-primary: #000;
      --md-sys-color-primary-container: #d0bcff;
      --md-sys-color-on-primary-container: #000;
      --md-sys-color-primary-fixed: #eaddff;
      --md-sys-color-primary-fixed-dim: #d0bcff;
      --md-sys-color-on-primary-fixed: #000;
      --md-sys-color-on-primary-fixed-variant: #000;
      --md-sys-color-secondary: #f6edff;
      --md-sys-color-on-secondary: #000;
      --md-sys-color-secondary-container: #ccc2dc;
      --md-sys-color-on-secondary-container: #000;
      --md-sys-color-secondary-fixed: #e8def8;
      --md-sys-color-secondary-fixed-dim: #ccc2dc;
      --md-sys-color-on-secondary-fixed: #000;
      --md-sys-color-on-secondary-fixed-variant: #000;
      --md-sys-color-tertiary: #ffecf1;
      --md-sys-color-on-tertiary: #000;
      --md-sys-color-tertiary-container: #efb8c8;
      --md-sys-color-on-tertiary-container: #000;
      --md-sys-color-tertiary-fixed: #ffd8e4;
      --md-sys-color-tertiary-fixed-dim: #efb8c8;
      --md-sys-color-on-tertiary-fixed: #000;
      --md-sys-color-on-tertiary-fixed-variant: #000;
      --md-sys-color-error: #fceeee;
      --md-sys-color-on-error: #000;
      --md-sys-color-error-container: #f2b8b5;
      --md-sys-color-on-error-container: #000;
      --md-sys-color-surface: #141218;
      --md-sys-color-surface-dim: #141218;
      --md-sys-color-surface-bright: #3b383e;
      --md-sys-color-surface-container-lowest: #0f0d13;
      --md-sys-color-surface-container-low: #1d1b20;
      --md-sys-color-surface-container: #211f26;
      --md-sys-color-surface-container-high: #2b2930;
      --md-sys-color-surface-container-highest: #36343b;
      --md-sys-color-on-surface: #fff;
      --md-sys-color-on-surface-variant: #fff;
      --md-sys-color-outline: #f5eefa;
      --md-sys-color-outline-variant: #cac4d0;
      --md-sys-color-inverse-surface: #e6e0e9;
      --md-sys-color-inverse-on-surface: #000;
      --md-sys-color-inverse-primary: #381e72;
    }
  }
  @supports (color: light-dark(#000, #fff)) {
    .md-contrast-high {
      --md-sys-color-primary: light-dark(#381e72, #f6edff);
      --md-sys-color-on-primary: light-dark(#fff, #000);
      --md-sys-color-primary-container: light-dark(#4f378b, #d0bcff);
      --md-sys-color-on-primary-container: light-dark(#fff, #000);
      --md-sys-color-primary-fixed: light-dark(#4f378b, #eaddff);
      --md-sys-color-primary-fixed-dim: light-dark(#381e72, #d0bcff);
      --md-sys-color-on-primary-fixed: light-dark(#fff, #000);
      --md-sys-color-on-primary-fixed-variant: light-dark(#fff, #000);
      --md-sys-color-secondary: light-dark(#332d41, #f6edff);
      --md-sys-color-on-secondary: light-dark(#fff, #000);
      --md-sys-color-secondary-container: light-dark(#4a4458, #ccc2dc);
      --md-sys-color-on-secondary-container: light-dark(#fff, #000);
      --md-sys-color-secondary-fixed: light-dark(#4a4458, #e8def8);
      --md-sys-color-secondary-fixed-dim: light-dark(#332d41, #ccc2dc);
      --md-sys-color-on-secondary-fixed: light-dark(#fff, #000);
      --md-sys-color-on-secondary-fixed-variant: light-dark(#fff, #000);
      --md-sys-color-tertiary: light-dark(#492532, #ffecf1);
      --md-sys-color-on-tertiary: light-dark(#fff, #000);
      --md-sys-color-tertiary-container: light-dark(#633b48, #efb8c8);
      --md-sys-color-on-tertiary-container: light-dark(#fff, #000);
      --md-sys-color-tertiary-fixed: light-dark(#633b48, #ffd8e4);
      --md-sys-color-tertiary-fixed-dim: light-dark(#492532, #efb8c8);
      --md-sys-color-on-tertiary-fixed: light-dark(#fff, #000);
      --md-sys-color-on-tertiary-fixed-variant: light-dark(#fff, #000);
      --md-sys-color-error: light-dark(#601410, #fceeee);
      --md-sys-color-on-error: light-dark(#fff, #000);
      --md-sys-color-error-container: light-dark(#8c1d18, #f2b8b5);
      --md-sys-color-on-error-container: light-dark(#fff, #000);
      --md-sys-color-surface: light-dark(#fef7ff, #141218);
      --md-sys-color-surface-dim: light-dark(#ded8e1, #141218);
      --md-sys-color-surface-bright: light-dark(#fef7ff, #3b383e);
      --md-sys-color-surface-container-lowest: light-dark(#fff, #0f0d13);
      --md-sys-color-surface-container-low: light-dark(#f7f2fa, #1d1b20);
      --md-sys-color-surface-container: light-dark(#f3edf7, #211f26);
      --md-sys-color-surface-container-high: light-dark(#ece6f0, #2b2930);
      --md-sys-color-surface-container-highest: light-dark(#e6e0e9, #36343b);
      --md-sys-color-on-surface: light-dark(#000, #fff);
      --md-sys-color-on-surface-variant: light-dark(#000, #fff);
      --md-sys-color-outline: light-dark(#322f37, #f5eefa);
      --md-sys-color-outline-variant: light-dark(#49454f, #cac4d0);
      --md-sys-color-inverse-surface: light-dark(#322f35, #e6e0e9);
      --md-sys-color-inverse-on-surface: light-dark(#fff, #000);
      --md-sys-color-inverse-primary: light-dark(#d0bcff, #381e72);
    }
  }
}
@layer md.sys.elevation {
  :root {
    --md-sys-elevation-shadow-0: none;
    --md-sys-elevation-shadow-1: 0 1px 2px 0 hsl(from var(--md-sys-color-shadow) h s l / 0.3), 0 1px 3px 1px hsl(from var(--md-sys-color-shadow) h s l / 0.15);
    --md-sys-elevation-shadow-2: 0 1px 2px 0 hsl(from var(--md-sys-color-shadow) h s l / 0.3), 0 2px 6px 2px hsl(from var(--md-sys-color-shadow) h s l / 0.15);
    --md-sys-elevation-shadow-3: 0 1px 3px 0 hsl(from var(--md-sys-color-shadow) h s l / 0.3), 0 4px 8px 3px hsl(from var(--md-sys-color-shadow) h s l / 0.15);
    --md-sys-elevation-shadow-4: 0 2px 3px 0 hsl(from var(--md-sys-color-shadow) h s l / 0.3), 0 6px 10px 4px hsl(from var(--md-sys-color-shadow) h s l / 0.15);
    --md-sys-elevation-shadow-5: 0 4px 4px 0 hsl(from var(--md-sys-color-shadow) h s l / 0.3), 0 8px 12px 6px hsl(from var(--md-sys-color-shadow) h s l / 0.15);
  }
}
@property --md-icon-font { syntax:"<string>#";inherits:true;initial-value:"Material Symbols" }
@property --md-icon-color { syntax:"<color>";inherits:true;initial-value:currentColor }
@property --md-icon-size { syntax:"<length-percentage>";inherits:true;initial-value:24px }
@property --md-icon-wght { syntax:"<number>";inherits:true;initial-value:400 }
@property --md-icon-fill { syntax:"<number>";inherits:true;initial-value:0 }
@property --md-icon-grad { syntax:"<number>";inherits:true;initial-value:0 }
@layer md.sys.icon {
  @media (prefers-color-scheme: dark) {
    :root {
      --md-icon-grad: -25;
    }
  }
  .md-icon,
  :host(.md-icon) {
    display: inline-flex;
    place-items: center;
    place-content: center;
    overflow: hidden;
    color: var(--md-icon-color, currentColor);
    fill: var(--md-icon-color, currentColor);
    aspect-ratio: 1;
    min-width: var(--md-icon-size, 24px);
    max-width: var(--md-icon-size, 24px);
    font-size: var(--md-icon-size, 24px);
    vertical-align: -0.115em;
    font-family: var(--md-icon-font, "Material Symbols");
    font-variation-settings:
      "opsz" var(--md-icon-opsz, clamp(20, tan(atan2(var(--md-icon-size, 24px), 1px)), 48)),
      "wght" var(--md-icon-wght, 400),
      "FILL" var(--md-icon-fill, 0),
      "GRAD" var(--md-icon-grad, 0);
    -webkit-font-smoothing: antialiased;
    transition: --md-icon-fill var(--md-sys-motion-spring-fast-effects-duration, 150ms) var(--md-sys-motion-spring-fast-effects, ease);
  }
  @media (prefers-reduced-motion: reduce) {
    .md-icon,
    :host(.md-icon) {
      transition: none;
    }
  }
}
@layer md.sys.layout {
  :root {
    --md-sys-layout-breakpoint-medium: 600px;
    --md-sys-layout-breakpoint-expanded: 840px;
    --md-sys-layout-breakpoint-large: 1200px;
    --md-sys-layout-breakpoint-extra-large: 1600px;
    --md-sys-layout-breakpoint-height-medium: 480px;
    --md-sys-layout-breakpoint-height-expanded: 900px;
    --md-sys-layout-third-pane-max-width: 400px;
  }
  @media (width < 600px) {
    :root {
      --md-sys-layout-margin: 16px;
      --md-sys-layout-spacer: 16px;
      --md-sys-layout-fixed-pane-width: 360px;
      --md-sys-layout-columns: 4;
      --md-sys-layout-panes-recommended: 1;
      --md-sys-layout-panes-max: 1;
    }
  }
  @media (width >= 600px) and (width < 840px) {
    :root {
      --md-sys-layout-margin: 24px;
      --md-sys-layout-spacer: 24px;
      --md-sys-layout-fixed-pane-width: 360px;
      --md-sys-layout-columns: 8;
      --md-sys-layout-panes-recommended: 1;
      --md-sys-layout-panes-max: 2;
    }
  }
  @media (width >= 840px) and (width < 1200px) {
    :root {
      --md-sys-layout-margin: 24px;
      --md-sys-layout-spacer: 24px;
      --md-sys-layout-fixed-pane-width: 360px;
      --md-sys-layout-columns: 8;
      --md-sys-layout-panes-recommended: 2;
      --md-sys-layout-panes-max: 2;
    }
  }
  @media (width >= 1200px) and (width < 1600px) {
    :root {
      --md-sys-layout-margin: 24px;
      --md-sys-layout-spacer: 24px;
      --md-sys-layout-fixed-pane-width: 412px;
      --md-sys-layout-columns: 12;
      --md-sys-layout-panes-recommended: 2;
      --md-sys-layout-panes-max: 2;
    }
  }
  @media (width >= 1600px) {
    :root {
      --md-sys-layout-margin: 24px;
      --md-sys-layout-spacer: 24px;
      --md-sys-layout-fixed-pane-width: 412px;
      --md-sys-layout-columns: 12;
      --md-sys-layout-panes-recommended: 2;
      --md-sys-layout-panes-max: 3;
    }
  }
  @media (horizontal-viewport-segments: 2) {
    :root {
      --md-sys-layout-fold-left: env(viewport-segment-right 0 0);
      --md-sys-layout-fold-width: calc( env(viewport-segment-left 1 0) - env(viewport-segment-right 0 0) );
    }
  }
  @media (vertical-viewport-segments: 2) {
    :root {
      --md-sys-layout-fold-top: env(viewport-segment-bottom 0 0);
      --md-sys-layout-fold-height: calc( env(viewport-segment-top 0 1) - env(viewport-segment-bottom 0 0) );
    }
  }
  .md-window {
    container: md-window/inline-size;
  }
  @container md-window (width < 600px) {
    :where(.md-window) > * {
      --md-sys-layout-margin: 16px;
      --md-sys-layout-spacer: 16px;
      --md-sys-layout-fixed-pane-width: 360px;
      --md-sys-layout-columns: 4;
      --md-sys-layout-panes-recommended: 1;
      --md-sys-layout-panes-max: 1;
    }
  }
  @container md-window (width >= 600px) and (width < 840px) {
    :where(.md-window) > * {
      --md-sys-layout-margin: 24px;
      --md-sys-layout-spacer: 24px;
      --md-sys-layout-fixed-pane-width: 360px;
      --md-sys-layout-columns: 8;
      --md-sys-layout-panes-recommended: 1;
      --md-sys-layout-panes-max: 2;
    }
  }
  @container md-window (width >= 840px) and (width < 1200px) {
    :where(.md-window) > * {
      --md-sys-layout-margin: 24px;
      --md-sys-layout-spacer: 24px;
      --md-sys-layout-fixed-pane-width: 360px;
      --md-sys-layout-columns: 8;
      --md-sys-layout-panes-recommended: 2;
      --md-sys-layout-panes-max: 2;
    }
  }
  @container md-window (width >= 1200px) and (width < 1600px) {
    :where(.md-window) > * {
      --md-sys-layout-margin: 24px;
      --md-sys-layout-spacer: 24px;
      --md-sys-layout-fixed-pane-width: 412px;
      --md-sys-layout-columns: 12;
      --md-sys-layout-panes-recommended: 2;
      --md-sys-layout-panes-max: 2;
    }
  }
  @container md-window (width >= 1600px) {
    :where(.md-window) > * {
      --md-sys-layout-margin: 24px;
      --md-sys-layout-spacer: 24px;
      --md-sys-layout-fixed-pane-width: 412px;
      --md-sys-layout-columns: 12;
      --md-sys-layout-panes-recommended: 2;
      --md-sys-layout-panes-max: 3;
    }
  }
  .md-layout-grid {
    box-sizing: border-box;
    column-gap: var(--md-sys-layout-spacer);
    display: grid;
    grid-template-columns: repeat(var(--md-sys-layout-columns), minmax(0, 1fr));
    padding-inline: var(--md-sys-layout-margin);
    row-gap: var(--md-sys-layout-spacer);
  }
}
@layer md.sys.motion {
  :root {
    --md-sys-motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
    --md-sys-motion-easing-standard-accelerate: cubic-bezier(0.3, 0, 1, 1);
    --md-sys-motion-easing-standard-decelerate: cubic-bezier(0, 0, 0, 1);
    --md-sys-motion-easing-emphasized: cubic-bezier(0.2, 0, 0, 1);
    --md-sys-motion-easing-emphasized-accelerate: cubic-bezier(0.3, 0, 0.8, 0.15);
    --md-sys-motion-easing-emphasized-decelerate: cubic-bezier(0.05, 0.7, 0.1, 1);
    --md-sys-motion-duration-short1: 50ms;
    --md-sys-motion-duration-short2: 100ms;
    --md-sys-motion-duration-short3: 150ms;
    --md-sys-motion-duration-short4: 200ms;
    --md-sys-motion-duration-medium1: 250ms;
    --md-sys-motion-duration-medium2: 300ms;
    --md-sys-motion-duration-medium3: 350ms;
    --md-sys-motion-duration-medium4: 400ms;
    --md-sys-motion-duration-long1: 450ms;
    --md-sys-motion-duration-long2: 500ms;
    --md-sys-motion-duration-long3: 550ms;
    --md-sys-motion-duration-long4: 600ms;
    --md-sys-motion-duration-extra-long1: 700ms;
    --md-sys-motion-duration-extra-long2: 800ms;
    --md-sys-motion-duration-extra-long3: 900ms;
    --md-sys-motion-duration-extra-long4: 1000ms;
  }
}
@layer md.sys.motion {
  :root {
    --md-sys-motion-spring-fast-spatial: linear(0, 0.007 1.25%, 0.018 2%, 0.033 2.75%, 0.074 4.25%, 0.127 5.75%, 0.178 7%, 0.246 8.5%, 0.526 14.25%, 0.641 16.75%, 0.756 19.5%, 0.846 22%, 0.921 24.5%, 0.981 27%, 1.026 29.5%, 1.061 32.25%, 1.078 34.25%, 1.089 36.25%, 1.094 38.5%, 1.094 40.75%, 1.081 46%, 1.019 60.25%, 0.999 68.5%, 0.993 73.75%, 0.991 80%, 1);
    --md-sys-motion-spring-fast-spatial-duration: 350ms;
    --md-sys-motion-curve-fast-spatial: cubic-bezier(0.42, 1.67, 0.21, 0.9);
    --md-sys-motion-curve-fast-spatial-duration: 350ms;
    --md-sys-motion-spring-default-spatial: linear(0, 0.005 1.25%, 0.022 2.75%, 0.056 4.5%, 0.099 6.25%, 0.143 7.75%, 0.199 9.5%, 0.43 16.25%, 0.536 19.5%, 0.631 22.75%, 0.715 26%, 0.781 29%, 0.84 32.25%, 0.888 35.5%, 0.929 39%, 0.961 42.75%, 0.986 47%, 1.002 51.5%, 1.012 56.75%, 1.015 67.25%, 1);
    --md-sys-motion-spring-default-spatial-duration: 420ms;
    --md-sys-motion-curve-default-spatial: cubic-bezier(0.38, 1.21, 0.22, 1);
    --md-sys-motion-curve-default-spatial-duration: 500ms;
    --md-sys-motion-spring-slow-spatial: linear(0, 0.007 1.5%, 0.026 3%, 0.06 4.75%, 0.104 6.5%, 0.147 8%, 0.202 9.75%, 0.43 16.5%, 0.534 19.75%, 0.628 23%, 0.711 26.25%, 0.782 29.5%, 0.84 32.75%, 0.888 36%, 0.928 39.5%, 0.96 43.25%, 0.984 47.5%, 1.001 52%, 1.011 57.25%, 1.015 62.25%, 1.015 68.25%, 1);
    --md-sys-motion-spring-slow-spatial-duration: 570ms;
    --md-sys-motion-curve-slow-spatial: cubic-bezier(0.39, 1.29, 0.35, 0.98);
    --md-sys-motion-curve-slow-spatial-duration: 650ms;
    --md-sys-motion-spring-fast-effects: linear(0, 0.005 1.25%, 0.02 2.5%, 0.047 4%, 0.083 5.5%, 0.16 8.25%, 0.364 14.75%, 0.46 18%, 0.553 21.5%, 0.63 24.75%, 0.695 28%, 0.755 31.5%, 0.807 35.25%, 0.849 39%, 0.889 43.5%, 0.921 48.5%, 0.946 54%, 0.966 60.25%, 0.979 67%, 0.988 75%, 1);
    --md-sys-motion-spring-fast-effects-duration: 140ms;
    --md-sys-motion-curve-fast-effects: cubic-bezier(0.31, 0.94, 0.34, 1);
    --md-sys-motion-curve-fast-effects-duration: 150ms;
    --md-sys-motion-spring-default-effects: linear(0, 0.006 1.25%, 0.021 2.5%, 0.049 4%, 0.085 5.5%, 0.165 8.25%, 0.365 14.5%, 0.455 17.5%, 0.551 21%, 0.629 24.25%, 0.696 27.5%, 0.756 31%, 0.809 34.75%, 0.852 38.5%, 0.891 43%, 0.924 48%, 0.948 53.5%, 0.967 59.75%, 0.98 66.5%, 0.989 74.75%, 1);
    --md-sys-motion-spring-default-effects-duration: 220ms;
    --md-sys-motion-curve-default-effects: cubic-bezier(0.34, 0.8, 0.34, 1);
    --md-sys-motion-curve-default-effects-duration: 200ms;
    --md-sys-motion-spring-slow-effects: linear(0, 0.005 1.25%, 0.02 2.5%, 0.046 4%, 0.08 5.5%, 0.163 8.5%, 0.364 15%, 0.458 18.25%, 0.551 21.75%, 0.626 25%, 0.696 28.5%, 0.754 32%, 0.806 35.75%, 0.848 39.5%, 0.887 44%, 0.919 49%, 0.945 54.5%, 0.964 60.75%, 0.978 67.5%, 0.988 75.5%, 1);
    --md-sys-motion-spring-slow-effects-duration: 300ms;
    --md-sys-motion-curve-slow-effects: cubic-bezier(0.34, 0.88, 0.34, 1);
    --md-sys-motion-curve-slow-effects-duration: 300ms;
  }
  :where(.md-motion-standard) {
    --md-sys-motion-spring-fast-spatial: linear(0, 0.004 1.5%, 0.017 3.25%, 0.041 5.25%, 0.073 7.25%, 0.115 9.5%, 0.174 12.25%, 0.383 21.25%, 0.462 24.75%, 0.53 28%, 0.589 31%, 0.659 35%, 0.721 39%, 0.777 43.25%, 0.824 47.5%, 0.867 52.25%, 0.902 57.25%, 0.932 62.75%, 0.955 68.5%, 0.972 74.75%, 0.985 81.75%, 0.993 89.25%, 1);
    --md-sys-motion-spring-fast-spatial-duration: 160ms;
    --md-sys-motion-curve-fast-spatial: cubic-bezier(0.27, 1.06, 0.18, 1);
    --md-sys-motion-curve-fast-spatial-duration: 350ms;
    --md-sys-motion-spring-default-spatial: linear(0, 0.005 1.75%, 0.018 3.5%, 0.042 5.5%, 0.073 7.5%, 0.115 9.75%, 0.172 12.5%, 0.381 21.75%, 0.463 25.5%, 0.529 28.75%, 0.586 31.75%, 0.655 35.75%, 0.716 39.75%, 0.771 44%, 0.818 48.25%, 0.861 53%, 0.897 58%, 0.926 63.25%, 0.95 69%, 0.968 75%, 0.982 81.75%, 1);
    --md-sys-motion-spring-default-spatial-duration: 220ms;
    --md-sys-motion-curve-default-spatial: cubic-bezier(0.27, 1.06, 0.18, 1);
    --md-sys-motion-curve-default-spatial-duration: 500ms;
    --md-sys-motion-spring-slow-spatial: linear(0, 0.004 1.5%, 0.016 3.25%, 0.04 5.25%, 0.071 7.25%, 0.112 9.5%, 0.17 12.25%, 0.381 21.5%, 0.464 25.25%, 0.531 28.5%, 0.589 31.5%, 0.658 35.5%, 0.719 39.5%, 0.774 43.75%, 0.821 48%, 0.864 52.75%, 0.9 57.75%, 0.928 63%, 0.952 68.75%, 0.97 75%, 0.983 81.75%, 0.992 89%, 1);
    --md-sys-motion-spring-slow-spatial-duration: 340ms;
    --md-sys-motion-curve-slow-spatial: cubic-bezier(0.27, 1.06, 0.18, 1);
    --md-sys-motion-curve-slow-spatial-duration: 750ms;
    --md-sys-motion-spring-fast-effects: linear(0, 0.005 1.25%, 0.02 2.5%, 0.047 4%, 0.083 5.5%, 0.16 8.25%, 0.364 14.75%, 0.46 18%, 0.553 21.5%, 0.63 24.75%, 0.695 28%, 0.755 31.5%, 0.807 35.25%, 0.849 39%, 0.889 43.5%, 0.921 48.5%, 0.946 54%, 0.966 60.25%, 0.979 67%, 0.988 75%, 1);
    --md-sys-motion-spring-fast-effects-duration: 140ms;
    --md-sys-motion-curve-fast-effects: cubic-bezier(0.31, 0.94, 0.34, 1);
    --md-sys-motion-curve-fast-effects-duration: 150ms;
    --md-sys-motion-spring-default-effects: linear(0, 0.006 1.25%, 0.021 2.5%, 0.049 4%, 0.085 5.5%, 0.165 8.25%, 0.365 14.5%, 0.455 17.5%, 0.551 21%, 0.629 24.25%, 0.696 27.5%, 0.756 31%, 0.809 34.75%, 0.852 38.5%, 0.891 43%, 0.924 48%, 0.948 53.5%, 0.967 59.75%, 0.98 66.5%, 0.989 74.75%, 1);
    --md-sys-motion-spring-default-effects-duration: 220ms;
    --md-sys-motion-curve-default-effects: cubic-bezier(0.34, 0.8, 0.34, 1);
    --md-sys-motion-curve-default-effects-duration: 200ms;
    --md-sys-motion-spring-slow-effects: linear(0, 0.005 1.25%, 0.02 2.5%, 0.046 4%, 0.08 5.5%, 0.163 8.5%, 0.364 15%, 0.458 18.25%, 0.551 21.75%, 0.626 25%, 0.696 28.5%, 0.754 32%, 0.806 35.75%, 0.848 39.5%, 0.887 44%, 0.919 49%, 0.945 54.5%, 0.964 60.75%, 0.978 67.5%, 0.988 75.5%, 1);
    --md-sys-motion-spring-slow-effects-duration: 300ms;
    --md-sys-motion-curve-slow-effects: cubic-bezier(0.34, 0.88, 0.34, 1);
    --md-sys-motion-curve-slow-effects-duration: 300ms;
  }
  @media (prefers-reduced-motion: reduce) {
    :root,
    :where(.md-motion-standard) {
      --md-sys-motion-spring-fast-spatial: linear;
      --md-sys-motion-spring-fast-spatial-duration: 0ms;
      --md-sys-motion-curve-fast-spatial: linear;
      --md-sys-motion-curve-fast-spatial-duration: 0ms;
      --md-sys-motion-spring-default-spatial: linear;
      --md-sys-motion-spring-default-spatial-duration: 0ms;
      --md-sys-motion-curve-default-spatial: linear;
      --md-sys-motion-curve-default-spatial-duration: 0ms;
      --md-sys-motion-spring-slow-spatial: linear;
      --md-sys-motion-spring-slow-spatial-duration: 0ms;
      --md-sys-motion-curve-slow-spatial: linear;
      --md-sys-motion-curve-slow-spatial-duration: 0ms;
    }
  }
  :where(.md-motion-reduced) {
    --md-sys-motion-spring-fast-spatial: linear;
    --md-sys-motion-spring-fast-spatial-duration: 0ms;
    --md-sys-motion-curve-fast-spatial: linear;
    --md-sys-motion-curve-fast-spatial-duration: 0ms;
    --md-sys-motion-spring-default-spatial: linear;
    --md-sys-motion-spring-default-spatial-duration: 0ms;
    --md-sys-motion-curve-default-spatial: linear;
    --md-sys-motion-curve-default-spatial-duration: 0ms;
    --md-sys-motion-spring-slow-spatial: linear;
    --md-sys-motion-spring-slow-spatial-duration: 0ms;
    --md-sys-motion-curve-slow-spatial: linear;
    --md-sys-motion-curve-slow-spatial-duration: 0ms;
  }
}
@layer md.sys.motion {
  :root {
    --md-transition-container-transform-duration: var( --md-sys-motion-duration-long2 );
    --md-transition-container-transform-easing: var( --md-sys-motion-easing-emphasized );
    --md-transition-shared-axis-duration: var(--md-sys-motion-duration-long1);
    --md-transition-shared-axis-easing: var(--md-sys-motion-easing-emphasized);
    --md-transition-shared-axis-distance: 30px;
    --md-transition-fade-through-duration: var(--md-sys-motion-duration-long1);
    --md-transition-fade-through-easing: var(--md-sys-motion-easing-emphasized);
    --md-transition-lateral-duration: var(--md-sys-motion-duration-long2);
    --md-transition-lateral-easing: var(--md-sys-motion-easing-emphasized);
    --md-transition-enter-duration: var(--md-sys-motion-duration-medium4);
    --md-transition-enter-easing: var( --md-sys-motion-easing-emphasized-decelerate );
    --md-transition-exit-duration: var(--md-sys-motion-duration-short4);
    --md-transition-exit-easing: var( --md-sys-motion-easing-emphasized-accelerate );
    --md-transition-exit-temporary-easing: var( --md-sys-motion-easing-emphasized );
    --md-transition-enter-fade-duration: var(--md-sys-motion-duration-short2);
    --md-transition-reduced-duration: var(--md-sys-motion-duration-short4);
    --md-transition-reduced-easing: var(--md-sys-motion-easing-standard);
    --md-transition-skeleton-fade-duration: var( --md-sys-motion-duration-short4 );
    --md-transition-skeleton-fade-easing: var(--md-sys-motion-easing-standard);
  }
  ::view-transition-group(md-container-transform) {
    animation-duration: var(--md-transition-container-transform-duration);
    animation-timing-function: var(--md-transition-container-transform-easing);
    overflow: clip;
  }
  ::view-transition-old(md-container-transform),
  ::view-transition-new(md-container-transform) {
    animation: none;
  }
  ::view-transition-group(md-transition-scope) {
    animation-duration: var(--md-transition-shared-axis-duration);
    animation-timing-function: var(--md-transition-shared-axis-easing);
    overflow: clip;
  }
  ::view-transition-old(md-transition-scope),
  ::view-transition-new(md-transition-scope),
  :root:is([data-md-transition=shared-axis], [data-md-transition=lateral], [data-md-transition=fade-through])::view-transition-old(root),
  :root:is([data-md-transition=shared-axis], [data-md-transition=lateral], [data-md-transition=fade-through])::view-transition-new(root) {
    animation: none;
    mix-blend-mode: normal;
  }
  :root[data-md-transition-reduced]::view-transition-group(md-container-transform),
  :root[data-md-transition-reduced]::view-transition-group(md-transition-scope) {
    animation: none;
  }
  .md-transition-enter,
  .md-transition-exit {
    --_outset: calc(-1 * var(--md-transition-clip-outset, 24px));
    --_clip: inset(var(--_outset) var(--_outset) 100% var(--_outset));
    --_scale: 1;
    --_translate: 0 0;
  }
  .md-transition-from-top {
    --_clip: inset(var(--_outset) var(--_outset) 100% var(--_outset));
    --_translate: 0 -100%;
  }
  .md-transition-from-bottom {
    --_clip: inset(100% var(--_outset) var(--_outset) var(--_outset));
    --_translate: 0 100%;
  }
  .md-transition-from-start {
    --_clip: inset(var(--_outset) 100% var(--_outset) var(--_outset));
    --_translate: -100% 0;
  }
  .md-transition-from-end {
    --_clip: inset(var(--_outset) var(--_outset) var(--_outset) 100%);
    --_translate: 100% 0;
  }
  .md-transition-from-start:dir(rtl) {
    --_clip: inset(var(--_outset) var(--_outset) var(--_outset) 100%);
    --_translate: 100% 0;
  }
  .md-transition-from-end:dir(rtl) {
    --_clip: inset(var(--_outset) 100% var(--_outset) var(--_outset));
    --_translate: -100% 0;
  }
  .md-transition-from-center {
    --_clip: inset(50% var(--_outset) 50% var(--_outset));
    --_translate: 0 0;
  }
  .md-transition-enter {
    animation: md-transition-clip-in var(--md-transition-enter-duration) var(--md-transition-enter-easing) both, md-transition-fade-in var(--md-transition-enter-fade-duration) var(--md-sys-motion-easing-standard) both;
  }
  .md-transition-exit {
    animation: md-transition-clip-out var(--md-transition-exit-duration) var(--md-transition-exit-easing) forwards, md-transition-fade-out var(--md-transition-exit-duration) var(--md-transition-exit-easing) forwards;
  }
  .md-transition-exit.md-transition-temporary {
    animation-timing-function: var(--md-transition-exit-temporary-easing);
  }
  .md-transition-enter.md-transition-scale {
    --_scale: 0.8;
    animation: md-transition-scale-in var(--md-transition-enter-duration) var(--md-transition-enter-easing) both, md-transition-fade-in var(--md-transition-enter-fade-duration) var(--md-sys-motion-easing-standard) both;
  }
  .md-transition-exit.md-transition-scale {
    animation: md-transition-fade-out var(--md-transition-exit-duration) var(--md-transition-exit-easing) forwards;
  }
  .md-transition-enter.md-transition-slide {
    animation: md-transition-slide-in var(--md-transition-enter-duration) var(--md-transition-enter-easing) both;
  }
  .md-transition-exit.md-transition-slide {
    animation: md-transition-slide-out var(--md-transition-exit-duration) var(--md-transition-exit-easing) forwards;
  }
  .md-transition-exit.md-transition-slide.md-transition-temporary {
    animation-timing-function: var(--md-transition-exit-temporary-easing);
  }
  .md-transition-enter.md-transition-reduced,
  .md-transition-exit.md-transition-reduced {
    animation-duration: var(--md-transition-reduced-duration);
    animation-name: md-transition-fade-in;
    animation-timing-function: var(--md-transition-reduced-easing);
  }
  .md-transition-exit.md-transition-reduced {
    animation-name: md-transition-fade-out;
  }
  @media (prefers-reduced-motion: reduce) {
    .md-transition-enter,
    .md-transition-exit {
      animation-duration: var(--md-transition-reduced-duration);
      animation-name: md-transition-fade-in;
      animation-timing-function: var(--md-transition-reduced-easing);
    }
    .md-transition-exit {
      animation-name: md-transition-fade-out;
    }
  }
  @keyframes md-transition-clip-in {
    from {
      clip-path: var(--_clip);
    }
    to {
      clip-path: inset(var(--_outset));
    }
  }
  @keyframes md-transition-clip-out {
    from {
      clip-path: inset(var(--_outset));
    }
    to {
      clip-path: var(--_clip);
    }
  }
  @keyframes md-transition-fade-in {
    from {
      opacity: 0;
    }
  }
  @keyframes md-transition-fade-out {
    to {
      opacity: 0;
    }
  }
  @keyframes md-transition-scale-in {
    from {
      scale: var(--_scale);
    }
  }
  @keyframes md-transition-slide-in {
    from {
      translate: var(--_translate);
    }
  }
  @keyframes md-transition-slide-out {
    to {
      translate: var(--_translate);
    }
  }
  .md-skeleton {
    --_color: var( --md-skeleton-color, var(--md-sys-color-surface-container-highest) );
    --_highlight: var( --md-skeleton-highlight-color, var(--md-sys-color-surface-container-low) );
    --_duration: var( --md-skeleton-pulse-duration, calc(var(--md-sys-motion-duration-extra-long4) * 2) );
    background-attachment: fixed;
    background-color: var(--_color);
    background-image:
      linear-gradient(
        135deg,
        transparent 40%,
        var(--_highlight) 50%,
        transparent 60%);
    background-repeat: no-repeat;
    background-size: 300vw 300vh;
    border-radius: var(--md-skeleton-shape, var(--md-sys-shape-corner-sm));
    animation: md-skeleton-pulse var(--_duration) var(--md-sys-motion-easing-emphasized) infinite;
  }
  .md-skeleton:dir(rtl) {
    background-image:
      linear-gradient(
        225deg,
        transparent 40%,
        var(--_highlight) 50%,
        transparent 60%);
    animation-name: md-skeleton-pulse-rtl;
  }
  .md-skeleton.md-skeleton-text {
    block-size: 1em;
    border-radius: var(--md-skeleton-shape, var(--md-sys-shape-corner-xs));
    margin-block: calc((1lh - 1em)/2);
  }
  .md-skeleton.md-skeleton-circle {
    aspect-ratio: 1;
    border-radius: var(--md-sys-shape-corner-full);
  }
  @media (prefers-reduced-motion: reduce) {
    .md-skeleton {
      animation: none;
      background-image: none;
    }
  }
  @keyframes md-skeleton-pulse {
    0% {
      background-position: 100% 100%;
    }
    50%, 100% {
      background-position: 0% 0%;
    }
  }
  @keyframes md-skeleton-pulse-rtl {
    0% {
      background-position: 0% 100%;
    }
    50%, 100% {
      background-position: 100% 0%;
    }
  }
}
@layer md.sys.shape {
  :root {
    --md-sys-shape-corner-none: 0px;
    --md-sys-shape-corner-xs: 4px;
    --md-sys-shape-corner-xs-top: 4px 4px 0px 0px;
    --md-sys-shape-corner-sm: 8px;
    --md-sys-shape-corner-md: 12px;
    --md-sys-shape-corner-lg: 16px;
    --md-sys-shape-corner-lg-top: 16px 16px 0px 0px;
    --md-sys-shape-corner-lg-start: 16px 0px 0px 16px;
    --md-sys-shape-corner-lg-end: 0px 16px 16px 0px;
    --md-sys-shape-corner-lg-increased: 20px;
    --md-sys-shape-corner-xl: 28px;
    --md-sys-shape-corner-xl-top: 28px 28px 0px 0px;
    --md-sys-shape-corner-xl-increased: 32px;
    --md-sys-shape-corner-xxl: 48px;
    --md-sys-shape-corner-full: 50cqmin;
    --md-sys-shape-corner-value-xs: 4px;
    --md-sys-shape-corner-value-sm: 8px;
    --md-sys-shape-corner-value-md: 12px;
    --md-sys-shape-corner-value-lg: 16px;
    --md-sys-shape-corner-value-lg-increased: 20px;
    --md-sys-shape-corner-value-xl: 28px;
    --md-sys-shape-corner-value-xl-increased: 32px;
    --md-sys-shape-corner-value-xxl: 48px;
    --md-sys-shape-family: round;
  }
  :root {
    --md-sys-shape-corner-none-start-start: var(--md-sys-shape-corner-none);
    --md-sys-shape-corner-none-start-end: var(--md-sys-shape-corner-none);
    --md-sys-shape-corner-none-end-end: var(--md-sys-shape-corner-none);
    --md-sys-shape-corner-none-end-start: var(--md-sys-shape-corner-none);
    --md-sys-shape-corner-xs-start-start: var(--md-sys-shape-corner-xs);
    --md-sys-shape-corner-xs-start-end: var(--md-sys-shape-corner-xs);
    --md-sys-shape-corner-xs-end-end: var(--md-sys-shape-corner-xs);
    --md-sys-shape-corner-xs-end-start: var(--md-sys-shape-corner-xs);
    --md-sys-shape-corner-sm-start-start: var(--md-sys-shape-corner-sm);
    --md-sys-shape-corner-sm-start-end: var(--md-sys-shape-corner-sm);
    --md-sys-shape-corner-sm-end-end: var(--md-sys-shape-corner-sm);
    --md-sys-shape-corner-sm-end-start: var(--md-sys-shape-corner-sm);
    --md-sys-shape-corner-md-start-start: var(--md-sys-shape-corner-md);
    --md-sys-shape-corner-md-start-end: var(--md-sys-shape-corner-md);
    --md-sys-shape-corner-md-end-end: var(--md-sys-shape-corner-md);
    --md-sys-shape-corner-md-end-start: var(--md-sys-shape-corner-md);
    --md-sys-shape-corner-lg-start-start: var(--md-sys-shape-corner-lg);
    --md-sys-shape-corner-lg-start-end: var(--md-sys-shape-corner-lg);
    --md-sys-shape-corner-lg-end-end: var(--md-sys-shape-corner-lg);
    --md-sys-shape-corner-lg-end-start: var(--md-sys-shape-corner-lg);
    --md-sys-shape-corner-xl-start-start: var(--md-sys-shape-corner-xl);
    --md-sys-shape-corner-xl-start-end: var(--md-sys-shape-corner-xl);
    --md-sys-shape-corner-xl-end-end: var(--md-sys-shape-corner-xl);
    --md-sys-shape-corner-xl-end-start: var(--md-sys-shape-corner-xl);
    --md-sys-shape-corner-xxl-start-start: var(--md-sys-shape-corner-xxl);
    --md-sys-shape-corner-xxl-start-end: var(--md-sys-shape-corner-xxl);
    --md-sys-shape-corner-xxl-end-end: var(--md-sys-shape-corner-xxl);
    --md-sys-shape-corner-xxl-end-start: var(--md-sys-shape-corner-xxl);
    --md-sys-shape-corner-full-start-start: var(--md-sys-shape-corner-full);
    --md-sys-shape-corner-full-start-end: var(--md-sys-shape-corner-full);
    --md-sys-shape-corner-full-end-end: var(--md-sys-shape-corner-full);
    --md-sys-shape-corner-full-end-start: var(--md-sys-shape-corner-full);
  }
  @supports (corner-shape: bevel) {
    [data-shape-family=cut] {
      --md-sys-shape-family: bevel;
    }
    [data-shape-family] :where(*) {
      corner-shape: var(--md-sys-shape-family);
    }
  }
}
@layer md.sys.space {
  :root {
    --md-sys-space-unit: 8px;
    --md-sys-space-0: calc(var(--md-sys-space-unit) * 0);
    --md-sys-space-25: calc(var(--md-sys-space-unit) * 0.25);
    --md-sys-space-50: calc(var(--md-sys-space-unit) * 0.5);
    --md-sys-space-75: calc(var(--md-sys-space-unit) * 0.75);
    --md-sys-space-100: var(--md-sys-space-unit);
    --md-sys-space-125: calc(var(--md-sys-space-unit) * 1.25);
    --md-sys-space-150: calc(var(--md-sys-space-unit) * 1.5);
    --md-sys-space-175: calc(var(--md-sys-space-unit) * 1.75);
    --md-sys-space-200: calc(var(--md-sys-space-unit) * 2);
    --md-sys-space-250: calc(var(--md-sys-space-unit) * 2.5);
    --md-sys-space-300: calc(var(--md-sys-space-unit) * 3);
    --md-sys-space-400: calc(var(--md-sys-space-unit) * 4);
    --md-sys-space-450: calc(var(--md-sys-space-unit) * 4.5);
    --md-sys-space-500: calc(var(--md-sys-space-unit) * 5);
    --md-sys-space-600: calc(var(--md-sys-space-unit) * 6);
    --md-sys-space-700: calc(var(--md-sys-space-unit) * 7);
    --md-sys-space-800: calc(var(--md-sys-space-unit) * 8);
    --md-sys-space-900: calc(var(--md-sys-space-unit) * 9);
  }
  @media (width < 600px) {
    :root {
      --md-sys-space-adaptive-inline: var(--md-sys-space-200);
      --md-sys-space-adaptive-block: var(--md-sys-space-200);
      --md-sys-space-adaptive-gap: var(--md-sys-space-100);
    }
  }
  @container md-window (width < 600px) {
    :where(.md-window) > * {
      --md-sys-space-adaptive-inline: var(--md-sys-space-200);
      --md-sys-space-adaptive-block: var(--md-sys-space-200);
      --md-sys-space-adaptive-gap: var(--md-sys-space-100);
    }
  }
  @media (width >= 600px) and (width < 840px) {
    :root {
      --md-sys-space-adaptive-inline: var(--md-sys-space-300);
      --md-sys-space-adaptive-block: var(--md-sys-space-300);
      --md-sys-space-adaptive-gap: var(--md-sys-space-200);
    }
  }
  @container md-window (width >= 600px) and (width < 840px) {
    :where(.md-window) > * {
      --md-sys-space-adaptive-inline: var(--md-sys-space-300);
      --md-sys-space-adaptive-block: var(--md-sys-space-300);
      --md-sys-space-adaptive-gap: var(--md-sys-space-200);
    }
  }
  @media (width >= 840px) and (width < 1200px) {
    :root {
      --md-sys-space-adaptive-inline: var(--md-sys-space-300);
      --md-sys-space-adaptive-block: var(--md-sys-space-400);
      --md-sys-space-adaptive-gap: var(--md-sys-space-200);
    }
  }
  @container md-window (width >= 840px) and (width < 1200px) {
    :where(.md-window) > * {
      --md-sys-space-adaptive-inline: var(--md-sys-space-300);
      --md-sys-space-adaptive-block: var(--md-sys-space-400);
      --md-sys-space-adaptive-gap: var(--md-sys-space-200);
    }
  }
  @media (width >= 1200px) and (width < 1600px) {
    :root {
      --md-sys-space-adaptive-inline: var(--md-sys-space-400);
      --md-sys-space-adaptive-block: var(--md-sys-space-400);
      --md-sys-space-adaptive-gap: var(--md-sys-space-300);
    }
  }
  @container md-window (width >= 1200px) and (width < 1600px) {
    :where(.md-window) > * {
      --md-sys-space-adaptive-inline: var(--md-sys-space-400);
      --md-sys-space-adaptive-block: var(--md-sys-space-400);
      --md-sys-space-adaptive-gap: var(--md-sys-space-300);
    }
  }
  @media (width >= 1600px) {
    :root {
      --md-sys-space-adaptive-inline: var(--md-sys-space-400);
      --md-sys-space-adaptive-block: var(--md-sys-space-500);
      --md-sys-space-adaptive-gap: var(--md-sys-space-300);
    }
  }
  @container md-window (width >= 1600px) {
    :where(.md-window) > * {
      --md-sys-space-adaptive-inline: var(--md-sys-space-400);
      --md-sys-space-adaptive-block: var(--md-sys-space-500);
      --md-sys-space-adaptive-gap: var(--md-sys-space-300);
    }
  }
}
@layer md.sys.typescale {
  :root {
    --md-ref-typeface-brand: var(--md-ref-typeface-plain);
    --md-ref-typeface-plain:
      Roboto Flex,
      Roboto,
      Noto Sans,
      system-ui,
      sans-serif;
    --md-ref-typeface-weight-regular: 400;
    --md-ref-typeface-weight-medium: 500;
    --md-ref-typeface-weight-bold: 700;
    --md-sys-typescale-label-sm-tracking: 0.03125rem;
    --md-sys-typescale-label-sm-axes: normal;
    --md-sys-typescale-emphasized-label-sm-axes: "ROND" 100;
    --md-sys-typescale-label-md-tracking: 0.03125rem;
    --md-sys-typescale-label-md-axes: normal;
    --md-sys-typescale-emphasized-label-md-axes: "ROND" 100;
    --md-sys-typescale-label-lg-tracking: 0.00625rem;
    --md-sys-typescale-label-lg-axes: normal;
    --md-sys-typescale-emphasized-label-lg-axes: "ROND" 100;
    --md-sys-typescale-body-sm-tracking: 0.025rem;
    --md-sys-typescale-body-sm-axes: normal;
    --md-sys-typescale-emphasized-body-sm-axes: "ROND" 100;
    --md-sys-typescale-body-md-tracking: 0.015625rem;
    --md-sys-typescale-body-md-axes: normal;
    --md-sys-typescale-emphasized-body-md-axes: "ROND" 100;
    --md-sys-typescale-body-lg-tracking: 0.03125rem;
    --md-sys-typescale-body-lg-axes: normal;
    --md-sys-typescale-emphasized-body-lg-axes: "ROND" 100;
    --md-sys-typescale-title-sm-tracking: 0.00625rem;
    --md-sys-typescale-title-sm-axes: normal;
    --md-sys-typescale-emphasized-title-sm-axes: "ROND" 100;
    --md-sys-typescale-title-md-tracking: 0.009375rem;
    --md-sys-typescale-title-md-axes: normal;
    --md-sys-typescale-emphasized-title-md-axes: "ROND" 100;
    --md-sys-typescale-title-lg-tracking: 0rem;
    --md-sys-typescale-title-lg-axes: normal;
    --md-sys-typescale-emphasized-title-lg-axes: "ROND" 100;
    --md-sys-typescale-headline-sm-tracking: 0rem;
    --md-sys-typescale-headline-sm-axes: normal;
    --md-sys-typescale-emphasized-headline-sm-axes: "ROND" 100;
    --md-sys-typescale-headline-md-tracking: 0rem;
    --md-sys-typescale-headline-md-axes: normal;
    --md-sys-typescale-emphasized-headline-md-axes: "ROND" 100;
    --md-sys-typescale-headline-lg-tracking: 0rem;
    --md-sys-typescale-headline-lg-axes: normal;
    --md-sys-typescale-emphasized-headline-lg-axes: "ROND" 100;
    --md-sys-typescale-display-sm-tracking: 0rem;
    --md-sys-typescale-display-sm-axes: normal;
    --md-sys-typescale-emphasized-display-sm-axes: "ROND" 100;
    --md-sys-typescale-display-md-tracking: 0rem;
    --md-sys-typescale-display-md-axes: normal;
    --md-sys-typescale-emphasized-display-md-axes: "ROND" 100;
    --md-sys-typescale-display-lg-tracking: -0.015625rem;
    --md-sys-typescale-display-lg-axes: normal;
    --md-sys-typescale-emphasized-display-lg-axes: "ROND" 100;
    --md-sys-language-height-scale: 1;
    --md-sys-typescale-label-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-label-sm-size:0.6875rem;
    --md-sys-typescale-label-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-label-sm-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-label-sm:var(--md-sys-typescale-label-sm-weight) var(--md-sys-typescale-label-sm-size)/var(--md-sys-typescale-label-sm-line-height) var(--md-sys-typescale-label-sm-font);
    --md-sys-typescale-emphasized-label-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-label-sm-size:0.6875rem;
    --md-sys-typescale-emphasized-label-sm-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-label-sm-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-label-sm:var(--md-sys-typescale-emphasized-label-sm-weight) var(--md-sys-typescale-emphasized-label-sm-size)/var(--md-sys-typescale-emphasized-label-sm-line-height) var(--md-sys-typescale-emphasized-label-sm-font);
    --md-sys-typescale-label-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-label-md-size:0.75rem;
    --md-sys-typescale-label-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-label-md-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-label-md:var(--md-sys-typescale-label-md-weight) var(--md-sys-typescale-label-md-size)/var(--md-sys-typescale-label-md-line-height) var(--md-sys-typescale-label-md-font);
    --md-sys-typescale-emphasized-label-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-label-md-size:0.75rem;
    --md-sys-typescale-emphasized-label-md-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-label-md-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-label-md:var(--md-sys-typescale-emphasized-label-md-weight) var(--md-sys-typescale-emphasized-label-md-size)/var(--md-sys-typescale-emphasized-label-md-line-height) var(--md-sys-typescale-emphasized-label-md-font);
    --md-sys-typescale-label-lg-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-label-lg-size:0.875rem;
    --md-sys-typescale-label-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-label-lg-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-label-lg:var(--md-sys-typescale-label-lg-weight) var(--md-sys-typescale-label-lg-size)/var(--md-sys-typescale-label-lg-line-height) var(--md-sys-typescale-label-lg-font);
    --md-sys-typescale-emphasized-label-lg-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-label-lg-size:0.875rem;
    --md-sys-typescale-emphasized-label-lg-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-label-lg-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-label-lg:var(--md-sys-typescale-emphasized-label-lg-weight) var(--md-sys-typescale-emphasized-label-lg-size)/var(--md-sys-typescale-emphasized-label-lg-line-height) var(--md-sys-typescale-emphasized-label-lg-font);
    --md-sys-typescale-body-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-body-sm-size:0.75rem;
    --md-sys-typescale-body-sm-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-body-sm-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-body-sm:var(--md-sys-typescale-body-sm-weight) var(--md-sys-typescale-body-sm-size)/var(--md-sys-typescale-body-sm-line-height) var(--md-sys-typescale-body-sm-font);
    --md-sys-typescale-emphasized-body-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-body-sm-size:0.75rem;
    --md-sys-typescale-emphasized-body-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-body-sm-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-body-sm:var(--md-sys-typescale-emphasized-body-sm-weight) var(--md-sys-typescale-emphasized-body-sm-size)/var(--md-sys-typescale-emphasized-body-sm-line-height) var(--md-sys-typescale-emphasized-body-sm-font);
    --md-sys-typescale-body-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-body-md-size:0.875rem;
    --md-sys-typescale-body-md-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-body-md-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-body-md:var(--md-sys-typescale-body-md-weight) var(--md-sys-typescale-body-md-size)/var(--md-sys-typescale-body-md-line-height) var(--md-sys-typescale-body-md-font);
    --md-sys-typescale-emphasized-body-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-body-md-size:0.875rem;
    --md-sys-typescale-emphasized-body-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-body-md-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-body-md:var(--md-sys-typescale-emphasized-body-md-weight) var(--md-sys-typescale-emphasized-body-md-size)/var(--md-sys-typescale-emphasized-body-md-line-height) var(--md-sys-typescale-emphasized-body-md-font);
    --md-sys-typescale-body-lg-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-body-lg-size:1rem;
    --md-sys-typescale-body-lg-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-body-lg-line-height:calc(1.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-body-lg:var(--md-sys-typescale-body-lg-weight) var(--md-sys-typescale-body-lg-size)/var(--md-sys-typescale-body-lg-line-height) var(--md-sys-typescale-body-lg-font);
    --md-sys-typescale-emphasized-body-lg-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-body-lg-size:1rem;
    --md-sys-typescale-emphasized-body-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-body-lg-line-height:calc(1.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-body-lg:var(--md-sys-typescale-emphasized-body-lg-weight) var(--md-sys-typescale-emphasized-body-lg-size)/var(--md-sys-typescale-emphasized-body-lg-line-height) var(--md-sys-typescale-emphasized-body-lg-font);
    --md-sys-typescale-title-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-title-sm-size:0.875rem;
    --md-sys-typescale-title-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-title-sm-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-title-sm:var(--md-sys-typescale-title-sm-weight) var(--md-sys-typescale-title-sm-size)/var(--md-sys-typescale-title-sm-line-height) var(--md-sys-typescale-title-sm-font);
    --md-sys-typescale-emphasized-title-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-title-sm-size:0.875rem;
    --md-sys-typescale-emphasized-title-sm-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-title-sm-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-title-sm:var(--md-sys-typescale-emphasized-title-sm-weight) var(--md-sys-typescale-emphasized-title-sm-size)/var(--md-sys-typescale-emphasized-title-sm-line-height) var(--md-sys-typescale-emphasized-title-sm-font);
    --md-sys-typescale-title-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-title-md-size:1rem;
    --md-sys-typescale-title-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-title-md-line-height:calc(1.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-title-md:var(--md-sys-typescale-title-md-weight) var(--md-sys-typescale-title-md-size)/var(--md-sys-typescale-title-md-line-height) var(--md-sys-typescale-title-md-font);
    --md-sys-typescale-emphasized-title-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-title-md-size:1rem;
    --md-sys-typescale-emphasized-title-md-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-title-md-line-height:calc(1.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-title-md:var(--md-sys-typescale-emphasized-title-md-weight) var(--md-sys-typescale-emphasized-title-md-size)/var(--md-sys-typescale-emphasized-title-md-line-height) var(--md-sys-typescale-emphasized-title-md-font);
    --md-sys-typescale-title-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-title-lg-size:1.375rem;
    --md-sys-typescale-title-lg-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-title-lg-line-height:calc(1.75rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-title-lg:var(--md-sys-typescale-title-lg-weight) var(--md-sys-typescale-title-lg-size)/var(--md-sys-typescale-title-lg-line-height) var(--md-sys-typescale-title-lg-font);
    --md-sys-typescale-emphasized-title-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-title-lg-size:1.375rem;
    --md-sys-typescale-emphasized-title-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-title-lg-line-height:calc(1.75rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-title-lg:var(--md-sys-typescale-emphasized-title-lg-weight) var(--md-sys-typescale-emphasized-title-lg-size)/var(--md-sys-typescale-emphasized-title-lg-line-height) var(--md-sys-typescale-emphasized-title-lg-font);
    --md-sys-typescale-headline-sm-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-headline-sm-size:1.5rem;
    --md-sys-typescale-headline-sm-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-headline-sm-line-height:calc(2rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-headline-sm:var(--md-sys-typescale-headline-sm-weight) var(--md-sys-typescale-headline-sm-size)/var(--md-sys-typescale-headline-sm-line-height) var(--md-sys-typescale-headline-sm-font);
    --md-sys-typescale-emphasized-headline-sm-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-headline-sm-size:1.5rem;
    --md-sys-typescale-emphasized-headline-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-headline-sm-line-height:calc(2rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-headline-sm:var(--md-sys-typescale-emphasized-headline-sm-weight) var(--md-sys-typescale-emphasized-headline-sm-size)/var(--md-sys-typescale-emphasized-headline-sm-line-height) var(--md-sys-typescale-emphasized-headline-sm-font);
    --md-sys-typescale-headline-md-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-headline-md-size:1.75rem;
    --md-sys-typescale-headline-md-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-headline-md-line-height:calc(2.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-headline-md:var(--md-sys-typescale-headline-md-weight) var(--md-sys-typescale-headline-md-size)/var(--md-sys-typescale-headline-md-line-height) var(--md-sys-typescale-headline-md-font);
    --md-sys-typescale-emphasized-headline-md-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-headline-md-size:1.75rem;
    --md-sys-typescale-emphasized-headline-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-headline-md-line-height:calc(2.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-headline-md:var(--md-sys-typescale-emphasized-headline-md-weight) var(--md-sys-typescale-emphasized-headline-md-size)/var(--md-sys-typescale-emphasized-headline-md-line-height) var(--md-sys-typescale-emphasized-headline-md-font);
    --md-sys-typescale-headline-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-headline-lg-size:2rem;
    --md-sys-typescale-headline-lg-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-headline-lg-line-height:calc(2.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-headline-lg:var(--md-sys-typescale-headline-lg-weight) var(--md-sys-typescale-headline-lg-size)/var(--md-sys-typescale-headline-lg-line-height) var(--md-sys-typescale-headline-lg-font);
    --md-sys-typescale-emphasized-headline-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-headline-lg-size:2rem;
    --md-sys-typescale-emphasized-headline-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-headline-lg-line-height:calc(2.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-headline-lg:var(--md-sys-typescale-emphasized-headline-lg-weight) var(--md-sys-typescale-emphasized-headline-lg-size)/var(--md-sys-typescale-emphasized-headline-lg-line-height) var(--md-sys-typescale-emphasized-headline-lg-font);
    --md-sys-typescale-display-sm-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-display-sm-size:2.25rem;
    --md-sys-typescale-display-sm-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-display-sm-line-height:calc(2.75rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-display-sm:var(--md-sys-typescale-display-sm-weight) var(--md-sys-typescale-display-sm-size)/var(--md-sys-typescale-display-sm-line-height) var(--md-sys-typescale-display-sm-font);
    --md-sys-typescale-emphasized-display-sm-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-display-sm-size:2.25rem;
    --md-sys-typescale-emphasized-display-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-display-sm-line-height:calc(2.75rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-display-sm:var(--md-sys-typescale-emphasized-display-sm-weight) var(--md-sys-typescale-emphasized-display-sm-size)/var(--md-sys-typescale-emphasized-display-sm-line-height) var(--md-sys-typescale-emphasized-display-sm-font);
    --md-sys-typescale-display-md-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-display-md-size:2.8125rem;
    --md-sys-typescale-display-md-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-display-md-line-height:calc(3.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-display-md:var(--md-sys-typescale-display-md-weight) var(--md-sys-typescale-display-md-size)/var(--md-sys-typescale-display-md-line-height) var(--md-sys-typescale-display-md-font);
    --md-sys-typescale-emphasized-display-md-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-display-md-size:2.8125rem;
    --md-sys-typescale-emphasized-display-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-display-md-line-height:calc(3.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-display-md:var(--md-sys-typescale-emphasized-display-md-weight) var(--md-sys-typescale-emphasized-display-md-size)/var(--md-sys-typescale-emphasized-display-md-line-height) var(--md-sys-typescale-emphasized-display-md-font);
    --md-sys-typescale-display-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-display-lg-size:3.5625rem;
    --md-sys-typescale-display-lg-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-display-lg-line-height:calc(4rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-display-lg:var(--md-sys-typescale-display-lg-weight) var(--md-sys-typescale-display-lg-size)/var(--md-sys-typescale-display-lg-line-height) var(--md-sys-typescale-display-lg-font);
    --md-sys-typescale-emphasized-display-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-display-lg-size:3.5625rem;
    --md-sys-typescale-emphasized-display-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-display-lg-line-height:calc(4rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-display-lg:var(--md-sys-typescale-emphasized-display-lg-weight) var(--md-sys-typescale-emphasized-display-lg-size)/var(--md-sys-typescale-emphasized-display-lg-line-height) var(--md-sys-typescale-emphasized-display-lg-font);
  }
  :lang(am),
  :lang(ar),
  :lang(hy),
  :lang(bn),
  :lang(zh),
  :lang(gu),
  :lang(hi),
  :lang(ja),
  :lang(kn),
  :lang(km),
  :lang(ko),
  :lang(lo),
  :lang(ml),
  :lang(or),
  :lang(pa),
  :lang(si),
  :lang(ta),
  :lang(th),
  :lang(vi),
  :lang(ne),
  :lang(mr),
  :lang(fa),
  :lang(ka) {
    --md-sys-language-height-scale: 1.07;
    --md-sys-typescale-label-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-label-sm-size:0.6875rem;
    --md-sys-typescale-label-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-label-sm-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-label-sm:var(--md-sys-typescale-label-sm-weight) var(--md-sys-typescale-label-sm-size)/var(--md-sys-typescale-label-sm-line-height) var(--md-sys-typescale-label-sm-font);
    --md-sys-typescale-emphasized-label-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-label-sm-size:0.6875rem;
    --md-sys-typescale-emphasized-label-sm-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-label-sm-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-label-sm:var(--md-sys-typescale-emphasized-label-sm-weight) var(--md-sys-typescale-emphasized-label-sm-size)/var(--md-sys-typescale-emphasized-label-sm-line-height) var(--md-sys-typescale-emphasized-label-sm-font);
    --md-sys-typescale-label-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-label-md-size:0.75rem;
    --md-sys-typescale-label-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-label-md-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-label-md:var(--md-sys-typescale-label-md-weight) var(--md-sys-typescale-label-md-size)/var(--md-sys-typescale-label-md-line-height) var(--md-sys-typescale-label-md-font);
    --md-sys-typescale-emphasized-label-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-label-md-size:0.75rem;
    --md-sys-typescale-emphasized-label-md-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-label-md-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-label-md:var(--md-sys-typescale-emphasized-label-md-weight) var(--md-sys-typescale-emphasized-label-md-size)/var(--md-sys-typescale-emphasized-label-md-line-height) var(--md-sys-typescale-emphasized-label-md-font);
    --md-sys-typescale-label-lg-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-label-lg-size:0.875rem;
    --md-sys-typescale-label-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-label-lg-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-label-lg:var(--md-sys-typescale-label-lg-weight) var(--md-sys-typescale-label-lg-size)/var(--md-sys-typescale-label-lg-line-height) var(--md-sys-typescale-label-lg-font);
    --md-sys-typescale-emphasized-label-lg-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-label-lg-size:0.875rem;
    --md-sys-typescale-emphasized-label-lg-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-label-lg-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-label-lg:var(--md-sys-typescale-emphasized-label-lg-weight) var(--md-sys-typescale-emphasized-label-lg-size)/var(--md-sys-typescale-emphasized-label-lg-line-height) var(--md-sys-typescale-emphasized-label-lg-font);
    --md-sys-typescale-body-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-body-sm-size:0.75rem;
    --md-sys-typescale-body-sm-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-body-sm-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-body-sm:var(--md-sys-typescale-body-sm-weight) var(--md-sys-typescale-body-sm-size)/var(--md-sys-typescale-body-sm-line-height) var(--md-sys-typescale-body-sm-font);
    --md-sys-typescale-emphasized-body-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-body-sm-size:0.75rem;
    --md-sys-typescale-emphasized-body-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-body-sm-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-body-sm:var(--md-sys-typescale-emphasized-body-sm-weight) var(--md-sys-typescale-emphasized-body-sm-size)/var(--md-sys-typescale-emphasized-body-sm-line-height) var(--md-sys-typescale-emphasized-body-sm-font);
    --md-sys-typescale-body-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-body-md-size:0.875rem;
    --md-sys-typescale-body-md-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-body-md-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-body-md:var(--md-sys-typescale-body-md-weight) var(--md-sys-typescale-body-md-size)/var(--md-sys-typescale-body-md-line-height) var(--md-sys-typescale-body-md-font);
    --md-sys-typescale-emphasized-body-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-body-md-size:0.875rem;
    --md-sys-typescale-emphasized-body-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-body-md-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-body-md:var(--md-sys-typescale-emphasized-body-md-weight) var(--md-sys-typescale-emphasized-body-md-size)/var(--md-sys-typescale-emphasized-body-md-line-height) var(--md-sys-typescale-emphasized-body-md-font);
    --md-sys-typescale-body-lg-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-body-lg-size:1rem;
    --md-sys-typescale-body-lg-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-body-lg-line-height:calc(1.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-body-lg:var(--md-sys-typescale-body-lg-weight) var(--md-sys-typescale-body-lg-size)/var(--md-sys-typescale-body-lg-line-height) var(--md-sys-typescale-body-lg-font);
    --md-sys-typescale-emphasized-body-lg-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-body-lg-size:1rem;
    --md-sys-typescale-emphasized-body-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-body-lg-line-height:calc(1.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-body-lg:var(--md-sys-typescale-emphasized-body-lg-weight) var(--md-sys-typescale-emphasized-body-lg-size)/var(--md-sys-typescale-emphasized-body-lg-line-height) var(--md-sys-typescale-emphasized-body-lg-font);
    --md-sys-typescale-title-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-title-sm-size:0.875rem;
    --md-sys-typescale-title-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-title-sm-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-title-sm:var(--md-sys-typescale-title-sm-weight) var(--md-sys-typescale-title-sm-size)/var(--md-sys-typescale-title-sm-line-height) var(--md-sys-typescale-title-sm-font);
    --md-sys-typescale-emphasized-title-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-title-sm-size:0.875rem;
    --md-sys-typescale-emphasized-title-sm-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-title-sm-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-title-sm:var(--md-sys-typescale-emphasized-title-sm-weight) var(--md-sys-typescale-emphasized-title-sm-size)/var(--md-sys-typescale-emphasized-title-sm-line-height) var(--md-sys-typescale-emphasized-title-sm-font);
    --md-sys-typescale-title-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-title-md-size:1rem;
    --md-sys-typescale-title-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-title-md-line-height:calc(1.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-title-md:var(--md-sys-typescale-title-md-weight) var(--md-sys-typescale-title-md-size)/var(--md-sys-typescale-title-md-line-height) var(--md-sys-typescale-title-md-font);
    --md-sys-typescale-emphasized-title-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-title-md-size:1rem;
    --md-sys-typescale-emphasized-title-md-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-title-md-line-height:calc(1.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-title-md:var(--md-sys-typescale-emphasized-title-md-weight) var(--md-sys-typescale-emphasized-title-md-size)/var(--md-sys-typescale-emphasized-title-md-line-height) var(--md-sys-typescale-emphasized-title-md-font);
    --md-sys-typescale-title-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-title-lg-size:1.375rem;
    --md-sys-typescale-title-lg-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-title-lg-line-height:calc(1.75rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-title-lg:var(--md-sys-typescale-title-lg-weight) var(--md-sys-typescale-title-lg-size)/var(--md-sys-typescale-title-lg-line-height) var(--md-sys-typescale-title-lg-font);
    --md-sys-typescale-emphasized-title-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-title-lg-size:1.375rem;
    --md-sys-typescale-emphasized-title-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-title-lg-line-height:calc(1.75rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-title-lg:var(--md-sys-typescale-emphasized-title-lg-weight) var(--md-sys-typescale-emphasized-title-lg-size)/var(--md-sys-typescale-emphasized-title-lg-line-height) var(--md-sys-typescale-emphasized-title-lg-font);
    --md-sys-typescale-headline-sm-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-headline-sm-size:1.5rem;
    --md-sys-typescale-headline-sm-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-headline-sm-line-height:calc(2rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-headline-sm:var(--md-sys-typescale-headline-sm-weight) var(--md-sys-typescale-headline-sm-size)/var(--md-sys-typescale-headline-sm-line-height) var(--md-sys-typescale-headline-sm-font);
    --md-sys-typescale-emphasized-headline-sm-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-headline-sm-size:1.5rem;
    --md-sys-typescale-emphasized-headline-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-headline-sm-line-height:calc(2rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-headline-sm:var(--md-sys-typescale-emphasized-headline-sm-weight) var(--md-sys-typescale-emphasized-headline-sm-size)/var(--md-sys-typescale-emphasized-headline-sm-line-height) var(--md-sys-typescale-emphasized-headline-sm-font);
    --md-sys-typescale-headline-md-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-headline-md-size:1.75rem;
    --md-sys-typescale-headline-md-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-headline-md-line-height:calc(2.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-headline-md:var(--md-sys-typescale-headline-md-weight) var(--md-sys-typescale-headline-md-size)/var(--md-sys-typescale-headline-md-line-height) var(--md-sys-typescale-headline-md-font);
    --md-sys-typescale-emphasized-headline-md-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-headline-md-size:1.75rem;
    --md-sys-typescale-emphasized-headline-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-headline-md-line-height:calc(2.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-headline-md:var(--md-sys-typescale-emphasized-headline-md-weight) var(--md-sys-typescale-emphasized-headline-md-size)/var(--md-sys-typescale-emphasized-headline-md-line-height) var(--md-sys-typescale-emphasized-headline-md-font);
    --md-sys-typescale-headline-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-headline-lg-size:2rem;
    --md-sys-typescale-headline-lg-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-headline-lg-line-height:calc(2.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-headline-lg:var(--md-sys-typescale-headline-lg-weight) var(--md-sys-typescale-headline-lg-size)/var(--md-sys-typescale-headline-lg-line-height) var(--md-sys-typescale-headline-lg-font);
    --md-sys-typescale-emphasized-headline-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-headline-lg-size:2rem;
    --md-sys-typescale-emphasized-headline-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-headline-lg-line-height:calc(2.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-headline-lg:var(--md-sys-typescale-emphasized-headline-lg-weight) var(--md-sys-typescale-emphasized-headline-lg-size)/var(--md-sys-typescale-emphasized-headline-lg-line-height) var(--md-sys-typescale-emphasized-headline-lg-font);
    --md-sys-typescale-display-sm-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-display-sm-size:2.25rem;
    --md-sys-typescale-display-sm-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-display-sm-line-height:calc(2.75rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-display-sm:var(--md-sys-typescale-display-sm-weight) var(--md-sys-typescale-display-sm-size)/var(--md-sys-typescale-display-sm-line-height) var(--md-sys-typescale-display-sm-font);
    --md-sys-typescale-emphasized-display-sm-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-display-sm-size:2.25rem;
    --md-sys-typescale-emphasized-display-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-display-sm-line-height:calc(2.75rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-display-sm:var(--md-sys-typescale-emphasized-display-sm-weight) var(--md-sys-typescale-emphasized-display-sm-size)/var(--md-sys-typescale-emphasized-display-sm-line-height) var(--md-sys-typescale-emphasized-display-sm-font);
    --md-sys-typescale-display-md-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-display-md-size:2.8125rem;
    --md-sys-typescale-display-md-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-display-md-line-height:calc(3.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-display-md:var(--md-sys-typescale-display-md-weight) var(--md-sys-typescale-display-md-size)/var(--md-sys-typescale-display-md-line-height) var(--md-sys-typescale-display-md-font);
    --md-sys-typescale-emphasized-display-md-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-display-md-size:2.8125rem;
    --md-sys-typescale-emphasized-display-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-display-md-line-height:calc(3.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-display-md:var(--md-sys-typescale-emphasized-display-md-weight) var(--md-sys-typescale-emphasized-display-md-size)/var(--md-sys-typescale-emphasized-display-md-line-height) var(--md-sys-typescale-emphasized-display-md-font);
    --md-sys-typescale-display-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-display-lg-size:3.5625rem;
    --md-sys-typescale-display-lg-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-display-lg-line-height:calc(4rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-display-lg:var(--md-sys-typescale-display-lg-weight) var(--md-sys-typescale-display-lg-size)/var(--md-sys-typescale-display-lg-line-height) var(--md-sys-typescale-display-lg-font);
    --md-sys-typescale-emphasized-display-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-display-lg-size:3.5625rem;
    --md-sys-typescale-emphasized-display-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-display-lg-line-height:calc(4rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-display-lg:var(--md-sys-typescale-emphasized-display-lg-weight) var(--md-sys-typescale-emphasized-display-lg-size)/var(--md-sys-typescale-emphasized-display-lg-line-height) var(--md-sys-typescale-emphasized-display-lg-font);
  }
  :lang(my),
  :lang(te) {
    --md-sys-language-height-scale: 1.3;
    --md-sys-typescale-label-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-label-sm-size:0.6875rem;
    --md-sys-typescale-label-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-label-sm-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-label-sm:var(--md-sys-typescale-label-sm-weight) var(--md-sys-typescale-label-sm-size)/var(--md-sys-typescale-label-sm-line-height) var(--md-sys-typescale-label-sm-font);
    --md-sys-typescale-emphasized-label-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-label-sm-size:0.6875rem;
    --md-sys-typescale-emphasized-label-sm-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-label-sm-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-label-sm:var(--md-sys-typescale-emphasized-label-sm-weight) var(--md-sys-typescale-emphasized-label-sm-size)/var(--md-sys-typescale-emphasized-label-sm-line-height) var(--md-sys-typescale-emphasized-label-sm-font);
    --md-sys-typescale-label-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-label-md-size:0.75rem;
    --md-sys-typescale-label-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-label-md-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-label-md:var(--md-sys-typescale-label-md-weight) var(--md-sys-typescale-label-md-size)/var(--md-sys-typescale-label-md-line-height) var(--md-sys-typescale-label-md-font);
    --md-sys-typescale-emphasized-label-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-label-md-size:0.75rem;
    --md-sys-typescale-emphasized-label-md-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-label-md-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-label-md:var(--md-sys-typescale-emphasized-label-md-weight) var(--md-sys-typescale-emphasized-label-md-size)/var(--md-sys-typescale-emphasized-label-md-line-height) var(--md-sys-typescale-emphasized-label-md-font);
    --md-sys-typescale-label-lg-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-label-lg-size:0.875rem;
    --md-sys-typescale-label-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-label-lg-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-label-lg:var(--md-sys-typescale-label-lg-weight) var(--md-sys-typescale-label-lg-size)/var(--md-sys-typescale-label-lg-line-height) var(--md-sys-typescale-label-lg-font);
    --md-sys-typescale-emphasized-label-lg-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-label-lg-size:0.875rem;
    --md-sys-typescale-emphasized-label-lg-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-label-lg-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-label-lg:var(--md-sys-typescale-emphasized-label-lg-weight) var(--md-sys-typescale-emphasized-label-lg-size)/var(--md-sys-typescale-emphasized-label-lg-line-height) var(--md-sys-typescale-emphasized-label-lg-font);
    --md-sys-typescale-body-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-body-sm-size:0.75rem;
    --md-sys-typescale-body-sm-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-body-sm-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-body-sm:var(--md-sys-typescale-body-sm-weight) var(--md-sys-typescale-body-sm-size)/var(--md-sys-typescale-body-sm-line-height) var(--md-sys-typescale-body-sm-font);
    --md-sys-typescale-emphasized-body-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-body-sm-size:0.75rem;
    --md-sys-typescale-emphasized-body-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-body-sm-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-body-sm:var(--md-sys-typescale-emphasized-body-sm-weight) var(--md-sys-typescale-emphasized-body-sm-size)/var(--md-sys-typescale-emphasized-body-sm-line-height) var(--md-sys-typescale-emphasized-body-sm-font);
    --md-sys-typescale-body-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-body-md-size:0.875rem;
    --md-sys-typescale-body-md-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-body-md-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-body-md:var(--md-sys-typescale-body-md-weight) var(--md-sys-typescale-body-md-size)/var(--md-sys-typescale-body-md-line-height) var(--md-sys-typescale-body-md-font);
    --md-sys-typescale-emphasized-body-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-body-md-size:0.875rem;
    --md-sys-typescale-emphasized-body-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-body-md-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-body-md:var(--md-sys-typescale-emphasized-body-md-weight) var(--md-sys-typescale-emphasized-body-md-size)/var(--md-sys-typescale-emphasized-body-md-line-height) var(--md-sys-typescale-emphasized-body-md-font);
    --md-sys-typescale-body-lg-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-body-lg-size:1rem;
    --md-sys-typescale-body-lg-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-body-lg-line-height:calc(1.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-body-lg:var(--md-sys-typescale-body-lg-weight) var(--md-sys-typescale-body-lg-size)/var(--md-sys-typescale-body-lg-line-height) var(--md-sys-typescale-body-lg-font);
    --md-sys-typescale-emphasized-body-lg-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-body-lg-size:1rem;
    --md-sys-typescale-emphasized-body-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-body-lg-line-height:calc(1.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-body-lg:var(--md-sys-typescale-emphasized-body-lg-weight) var(--md-sys-typescale-emphasized-body-lg-size)/var(--md-sys-typescale-emphasized-body-lg-line-height) var(--md-sys-typescale-emphasized-body-lg-font);
    --md-sys-typescale-title-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-title-sm-size:0.875rem;
    --md-sys-typescale-title-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-title-sm-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-title-sm:var(--md-sys-typescale-title-sm-weight) var(--md-sys-typescale-title-sm-size)/var(--md-sys-typescale-title-sm-line-height) var(--md-sys-typescale-title-sm-font);
    --md-sys-typescale-emphasized-title-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-title-sm-size:0.875rem;
    --md-sys-typescale-emphasized-title-sm-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-title-sm-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-title-sm:var(--md-sys-typescale-emphasized-title-sm-weight) var(--md-sys-typescale-emphasized-title-sm-size)/var(--md-sys-typescale-emphasized-title-sm-line-height) var(--md-sys-typescale-emphasized-title-sm-font);
    --md-sys-typescale-title-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-title-md-size:1rem;
    --md-sys-typescale-title-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-title-md-line-height:calc(1.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-title-md:var(--md-sys-typescale-title-md-weight) var(--md-sys-typescale-title-md-size)/var(--md-sys-typescale-title-md-line-height) var(--md-sys-typescale-title-md-font);
    --md-sys-typescale-emphasized-title-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-title-md-size:1rem;
    --md-sys-typescale-emphasized-title-md-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-title-md-line-height:calc(1.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-title-md:var(--md-sys-typescale-emphasized-title-md-weight) var(--md-sys-typescale-emphasized-title-md-size)/var(--md-sys-typescale-emphasized-title-md-line-height) var(--md-sys-typescale-emphasized-title-md-font);
    --md-sys-typescale-title-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-title-lg-size:1.375rem;
    --md-sys-typescale-title-lg-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-title-lg-line-height:calc(1.75rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-title-lg:var(--md-sys-typescale-title-lg-weight) var(--md-sys-typescale-title-lg-size)/var(--md-sys-typescale-title-lg-line-height) var(--md-sys-typescale-title-lg-font);
    --md-sys-typescale-emphasized-title-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-title-lg-size:1.375rem;
    --md-sys-typescale-emphasized-title-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-title-lg-line-height:calc(1.75rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-title-lg:var(--md-sys-typescale-emphasized-title-lg-weight) var(--md-sys-typescale-emphasized-title-lg-size)/var(--md-sys-typescale-emphasized-title-lg-line-height) var(--md-sys-typescale-emphasized-title-lg-font);
    --md-sys-typescale-headline-sm-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-headline-sm-size:1.5rem;
    --md-sys-typescale-headline-sm-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-headline-sm-line-height:calc(2rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-headline-sm:var(--md-sys-typescale-headline-sm-weight) var(--md-sys-typescale-headline-sm-size)/var(--md-sys-typescale-headline-sm-line-height) var(--md-sys-typescale-headline-sm-font);
    --md-sys-typescale-emphasized-headline-sm-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-headline-sm-size:1.5rem;
    --md-sys-typescale-emphasized-headline-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-headline-sm-line-height:calc(2rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-headline-sm:var(--md-sys-typescale-emphasized-headline-sm-weight) var(--md-sys-typescale-emphasized-headline-sm-size)/var(--md-sys-typescale-emphasized-headline-sm-line-height) var(--md-sys-typescale-emphasized-headline-sm-font);
    --md-sys-typescale-headline-md-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-headline-md-size:1.75rem;
    --md-sys-typescale-headline-md-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-headline-md-line-height:calc(2.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-headline-md:var(--md-sys-typescale-headline-md-weight) var(--md-sys-typescale-headline-md-size)/var(--md-sys-typescale-headline-md-line-height) var(--md-sys-typescale-headline-md-font);
    --md-sys-typescale-emphasized-headline-md-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-headline-md-size:1.75rem;
    --md-sys-typescale-emphasized-headline-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-headline-md-line-height:calc(2.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-headline-md:var(--md-sys-typescale-emphasized-headline-md-weight) var(--md-sys-typescale-emphasized-headline-md-size)/var(--md-sys-typescale-emphasized-headline-md-line-height) var(--md-sys-typescale-emphasized-headline-md-font);
    --md-sys-typescale-headline-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-headline-lg-size:2rem;
    --md-sys-typescale-headline-lg-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-headline-lg-line-height:calc(2.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-headline-lg:var(--md-sys-typescale-headline-lg-weight) var(--md-sys-typescale-headline-lg-size)/var(--md-sys-typescale-headline-lg-line-height) var(--md-sys-typescale-headline-lg-font);
    --md-sys-typescale-emphasized-headline-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-headline-lg-size:2rem;
    --md-sys-typescale-emphasized-headline-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-headline-lg-line-height:calc(2.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-headline-lg:var(--md-sys-typescale-emphasized-headline-lg-weight) var(--md-sys-typescale-emphasized-headline-lg-size)/var(--md-sys-typescale-emphasized-headline-lg-line-height) var(--md-sys-typescale-emphasized-headline-lg-font);
    --md-sys-typescale-display-sm-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-display-sm-size:2.25rem;
    --md-sys-typescale-display-sm-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-display-sm-line-height:calc(2.75rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-display-sm:var(--md-sys-typescale-display-sm-weight) var(--md-sys-typescale-display-sm-size)/var(--md-sys-typescale-display-sm-line-height) var(--md-sys-typescale-display-sm-font);
    --md-sys-typescale-emphasized-display-sm-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-display-sm-size:2.25rem;
    --md-sys-typescale-emphasized-display-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-display-sm-line-height:calc(2.75rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-display-sm:var(--md-sys-typescale-emphasized-display-sm-weight) var(--md-sys-typescale-emphasized-display-sm-size)/var(--md-sys-typescale-emphasized-display-sm-line-height) var(--md-sys-typescale-emphasized-display-sm-font);
    --md-sys-typescale-display-md-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-display-md-size:2.8125rem;
    --md-sys-typescale-display-md-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-display-md-line-height:calc(3.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-display-md:var(--md-sys-typescale-display-md-weight) var(--md-sys-typescale-display-md-size)/var(--md-sys-typescale-display-md-line-height) var(--md-sys-typescale-display-md-font);
    --md-sys-typescale-emphasized-display-md-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-display-md-size:2.8125rem;
    --md-sys-typescale-emphasized-display-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-display-md-line-height:calc(3.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-display-md:var(--md-sys-typescale-emphasized-display-md-weight) var(--md-sys-typescale-emphasized-display-md-size)/var(--md-sys-typescale-emphasized-display-md-line-height) var(--md-sys-typescale-emphasized-display-md-font);
    --md-sys-typescale-display-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-display-lg-size:3.5625rem;
    --md-sys-typescale-display-lg-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-display-lg-line-height:calc(4rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-display-lg:var(--md-sys-typescale-display-lg-weight) var(--md-sys-typescale-display-lg-size)/var(--md-sys-typescale-display-lg-line-height) var(--md-sys-typescale-display-lg-font);
    --md-sys-typescale-emphasized-display-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-display-lg-size:3.5625rem;
    --md-sys-typescale-emphasized-display-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-display-lg-line-height:calc(4rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-display-lg:var(--md-sys-typescale-emphasized-display-lg-weight) var(--md-sys-typescale-emphasized-display-lg-size)/var(--md-sys-typescale-emphasized-display-lg-line-height) var(--md-sys-typescale-emphasized-display-lg-font);
  }
  :lang(ur) {
    --md-sys-language-height-scale: 2;
    --md-sys-typescale-label-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-label-sm-size:0.6875rem;
    --md-sys-typescale-label-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-label-sm-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-label-sm:var(--md-sys-typescale-label-sm-weight) var(--md-sys-typescale-label-sm-size)/var(--md-sys-typescale-label-sm-line-height) var(--md-sys-typescale-label-sm-font);
    --md-sys-typescale-emphasized-label-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-label-sm-size:0.6875rem;
    --md-sys-typescale-emphasized-label-sm-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-label-sm-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-label-sm:var(--md-sys-typescale-emphasized-label-sm-weight) var(--md-sys-typescale-emphasized-label-sm-size)/var(--md-sys-typescale-emphasized-label-sm-line-height) var(--md-sys-typescale-emphasized-label-sm-font);
    --md-sys-typescale-label-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-label-md-size:0.75rem;
    --md-sys-typescale-label-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-label-md-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-label-md:var(--md-sys-typescale-label-md-weight) var(--md-sys-typescale-label-md-size)/var(--md-sys-typescale-label-md-line-height) var(--md-sys-typescale-label-md-font);
    --md-sys-typescale-emphasized-label-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-label-md-size:0.75rem;
    --md-sys-typescale-emphasized-label-md-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-label-md-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-label-md:var(--md-sys-typescale-emphasized-label-md-weight) var(--md-sys-typescale-emphasized-label-md-size)/var(--md-sys-typescale-emphasized-label-md-line-height) var(--md-sys-typescale-emphasized-label-md-font);
    --md-sys-typescale-label-lg-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-label-lg-size:0.875rem;
    --md-sys-typescale-label-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-label-lg-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-label-lg:var(--md-sys-typescale-label-lg-weight) var(--md-sys-typescale-label-lg-size)/var(--md-sys-typescale-label-lg-line-height) var(--md-sys-typescale-label-lg-font);
    --md-sys-typescale-emphasized-label-lg-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-label-lg-size:0.875rem;
    --md-sys-typescale-emphasized-label-lg-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-label-lg-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-label-lg:var(--md-sys-typescale-emphasized-label-lg-weight) var(--md-sys-typescale-emphasized-label-lg-size)/var(--md-sys-typescale-emphasized-label-lg-line-height) var(--md-sys-typescale-emphasized-label-lg-font);
    --md-sys-typescale-body-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-body-sm-size:0.75rem;
    --md-sys-typescale-body-sm-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-body-sm-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-body-sm:var(--md-sys-typescale-body-sm-weight) var(--md-sys-typescale-body-sm-size)/var(--md-sys-typescale-body-sm-line-height) var(--md-sys-typescale-body-sm-font);
    --md-sys-typescale-emphasized-body-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-body-sm-size:0.75rem;
    --md-sys-typescale-emphasized-body-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-body-sm-line-height:calc(1rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-body-sm:var(--md-sys-typescale-emphasized-body-sm-weight) var(--md-sys-typescale-emphasized-body-sm-size)/var(--md-sys-typescale-emphasized-body-sm-line-height) var(--md-sys-typescale-emphasized-body-sm-font);
    --md-sys-typescale-body-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-body-md-size:0.875rem;
    --md-sys-typescale-body-md-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-body-md-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-body-md:var(--md-sys-typescale-body-md-weight) var(--md-sys-typescale-body-md-size)/var(--md-sys-typescale-body-md-line-height) var(--md-sys-typescale-body-md-font);
    --md-sys-typescale-emphasized-body-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-body-md-size:0.875rem;
    --md-sys-typescale-emphasized-body-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-body-md-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-body-md:var(--md-sys-typescale-emphasized-body-md-weight) var(--md-sys-typescale-emphasized-body-md-size)/var(--md-sys-typescale-emphasized-body-md-line-height) var(--md-sys-typescale-emphasized-body-md-font);
    --md-sys-typescale-body-lg-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-body-lg-size:1rem;
    --md-sys-typescale-body-lg-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-body-lg-line-height:calc(1.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-body-lg:var(--md-sys-typescale-body-lg-weight) var(--md-sys-typescale-body-lg-size)/var(--md-sys-typescale-body-lg-line-height) var(--md-sys-typescale-body-lg-font);
    --md-sys-typescale-emphasized-body-lg-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-body-lg-size:1rem;
    --md-sys-typescale-emphasized-body-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-body-lg-line-height:calc(1.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-body-lg:var(--md-sys-typescale-emphasized-body-lg-weight) var(--md-sys-typescale-emphasized-body-lg-size)/var(--md-sys-typescale-emphasized-body-lg-line-height) var(--md-sys-typescale-emphasized-body-lg-font);
    --md-sys-typescale-title-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-title-sm-size:0.875rem;
    --md-sys-typescale-title-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-title-sm-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-title-sm:var(--md-sys-typescale-title-sm-weight) var(--md-sys-typescale-title-sm-size)/var(--md-sys-typescale-title-sm-line-height) var(--md-sys-typescale-title-sm-font);
    --md-sys-typescale-emphasized-title-sm-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-title-sm-size:0.875rem;
    --md-sys-typescale-emphasized-title-sm-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-title-sm-line-height:calc(1.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-title-sm:var(--md-sys-typescale-emphasized-title-sm-weight) var(--md-sys-typescale-emphasized-title-sm-size)/var(--md-sys-typescale-emphasized-title-sm-line-height) var(--md-sys-typescale-emphasized-title-sm-font);
    --md-sys-typescale-title-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-title-md-size:1rem;
    --md-sys-typescale-title-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-title-md-line-height:calc(1.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-title-md:var(--md-sys-typescale-title-md-weight) var(--md-sys-typescale-title-md-size)/var(--md-sys-typescale-title-md-line-height) var(--md-sys-typescale-title-md-font);
    --md-sys-typescale-emphasized-title-md-font:var(--md-ref-typeface-plain);
    --md-sys-typescale-emphasized-title-md-size:1rem;
    --md-sys-typescale-emphasized-title-md-weight:var(--md-ref-typeface-weight-bold);
    --md-sys-typescale-emphasized-title-md-line-height:calc(1.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-title-md:var(--md-sys-typescale-emphasized-title-md-weight) var(--md-sys-typescale-emphasized-title-md-size)/var(--md-sys-typescale-emphasized-title-md-line-height) var(--md-sys-typescale-emphasized-title-md-font);
    --md-sys-typescale-title-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-title-lg-size:1.375rem;
    --md-sys-typescale-title-lg-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-title-lg-line-height:calc(1.75rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-title-lg:var(--md-sys-typescale-title-lg-weight) var(--md-sys-typescale-title-lg-size)/var(--md-sys-typescale-title-lg-line-height) var(--md-sys-typescale-title-lg-font);
    --md-sys-typescale-emphasized-title-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-title-lg-size:1.375rem;
    --md-sys-typescale-emphasized-title-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-title-lg-line-height:calc(1.75rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-title-lg:var(--md-sys-typescale-emphasized-title-lg-weight) var(--md-sys-typescale-emphasized-title-lg-size)/var(--md-sys-typescale-emphasized-title-lg-line-height) var(--md-sys-typescale-emphasized-title-lg-font);
    --md-sys-typescale-headline-sm-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-headline-sm-size:1.5rem;
    --md-sys-typescale-headline-sm-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-headline-sm-line-height:calc(2rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-headline-sm:var(--md-sys-typescale-headline-sm-weight) var(--md-sys-typescale-headline-sm-size)/var(--md-sys-typescale-headline-sm-line-height) var(--md-sys-typescale-headline-sm-font);
    --md-sys-typescale-emphasized-headline-sm-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-headline-sm-size:1.5rem;
    --md-sys-typescale-emphasized-headline-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-headline-sm-line-height:calc(2rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-headline-sm:var(--md-sys-typescale-emphasized-headline-sm-weight) var(--md-sys-typescale-emphasized-headline-sm-size)/var(--md-sys-typescale-emphasized-headline-sm-line-height) var(--md-sys-typescale-emphasized-headline-sm-font);
    --md-sys-typescale-headline-md-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-headline-md-size:1.75rem;
    --md-sys-typescale-headline-md-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-headline-md-line-height:calc(2.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-headline-md:var(--md-sys-typescale-headline-md-weight) var(--md-sys-typescale-headline-md-size)/var(--md-sys-typescale-headline-md-line-height) var(--md-sys-typescale-headline-md-font);
    --md-sys-typescale-emphasized-headline-md-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-headline-md-size:1.75rem;
    --md-sys-typescale-emphasized-headline-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-headline-md-line-height:calc(2.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-headline-md:var(--md-sys-typescale-emphasized-headline-md-weight) var(--md-sys-typescale-emphasized-headline-md-size)/var(--md-sys-typescale-emphasized-headline-md-line-height) var(--md-sys-typescale-emphasized-headline-md-font);
    --md-sys-typescale-headline-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-headline-lg-size:2rem;
    --md-sys-typescale-headline-lg-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-headline-lg-line-height:calc(2.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-headline-lg:var(--md-sys-typescale-headline-lg-weight) var(--md-sys-typescale-headline-lg-size)/var(--md-sys-typescale-headline-lg-line-height) var(--md-sys-typescale-headline-lg-font);
    --md-sys-typescale-emphasized-headline-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-headline-lg-size:2rem;
    --md-sys-typescale-emphasized-headline-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-headline-lg-line-height:calc(2.5rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-headline-lg:var(--md-sys-typescale-emphasized-headline-lg-weight) var(--md-sys-typescale-emphasized-headline-lg-size)/var(--md-sys-typescale-emphasized-headline-lg-line-height) var(--md-sys-typescale-emphasized-headline-lg-font);
    --md-sys-typescale-display-sm-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-display-sm-size:2.25rem;
    --md-sys-typescale-display-sm-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-display-sm-line-height:calc(2.75rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-display-sm:var(--md-sys-typescale-display-sm-weight) var(--md-sys-typescale-display-sm-size)/var(--md-sys-typescale-display-sm-line-height) var(--md-sys-typescale-display-sm-font);
    --md-sys-typescale-emphasized-display-sm-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-display-sm-size:2.25rem;
    --md-sys-typescale-emphasized-display-sm-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-display-sm-line-height:calc(2.75rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-display-sm:var(--md-sys-typescale-emphasized-display-sm-weight) var(--md-sys-typescale-emphasized-display-sm-size)/var(--md-sys-typescale-emphasized-display-sm-line-height) var(--md-sys-typescale-emphasized-display-sm-font);
    --md-sys-typescale-display-md-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-display-md-size:2.8125rem;
    --md-sys-typescale-display-md-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-display-md-line-height:calc(3.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-display-md:var(--md-sys-typescale-display-md-weight) var(--md-sys-typescale-display-md-size)/var(--md-sys-typescale-display-md-line-height) var(--md-sys-typescale-display-md-font);
    --md-sys-typescale-emphasized-display-md-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-display-md-size:2.8125rem;
    --md-sys-typescale-emphasized-display-md-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-display-md-line-height:calc(3.25rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-display-md:var(--md-sys-typescale-emphasized-display-md-weight) var(--md-sys-typescale-emphasized-display-md-size)/var(--md-sys-typescale-emphasized-display-md-line-height) var(--md-sys-typescale-emphasized-display-md-font);
    --md-sys-typescale-display-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-display-lg-size:3.5625rem;
    --md-sys-typescale-display-lg-weight:var(--md-ref-typeface-weight-regular);
    --md-sys-typescale-display-lg-line-height:calc(4rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-display-lg:var(--md-sys-typescale-display-lg-weight) var(--md-sys-typescale-display-lg-size)/var(--md-sys-typescale-display-lg-line-height) var(--md-sys-typescale-display-lg-font);
    --md-sys-typescale-emphasized-display-lg-font:var(--md-ref-typeface-brand);
    --md-sys-typescale-emphasized-display-lg-size:3.5625rem;
    --md-sys-typescale-emphasized-display-lg-weight:var(--md-ref-typeface-weight-medium);
    --md-sys-typescale-emphasized-display-lg-line-height:calc(4rem*var(--md-sys-language-height-scale));
    --md-sys-typescale-emphasized-display-lg:var(--md-sys-typescale-emphasized-display-lg-weight) var(--md-sys-typescale-emphasized-display-lg-size)/var(--md-sys-typescale-emphasized-display-lg-line-height) var(--md-sys-typescale-emphasized-display-lg-font);
  }
}
@layer md.sys.typescale {
  a:not([class], [role]) {
    color: var(--md-sys-color-primary);
    text-decoration-line: underline;
  }
}

/* src/gb/navigation.css */
@view-transition {
  navigation: auto;
}
:root {
  --gb-vt-exit: 100ms;
  --gb-vt-enter: 200ms;
  --gb-vt-slide: 300ms;
  --gb-vt-shift: 30px;
}
:root:dir(rtl) {
  --gb-vt-shift: -30px;
}
@media (prefers-reduced-motion: reduce) {
  :root {
    --gb-vt-shift: 0px;
  }
}
.gb-content-pane {
  view-transition-name: gb-page;
  view-transition-class: page;
}
.gb-toc {
  view-transition-name: gb-toc;
  view-transition-class: outline;
}
.gb-vt :is(.gb-content-pane, .gb-outline-body)::-webkit-scrollbar-thumb {
  background: transparent;
}
@supports not selector(::-webkit-scrollbar) {
  .gb-vt :is(.gb-content-pane, .gb-outline-body) {
    scrollbar-color: transparent transparent;
  }
}
.gb-top {
  view-transition-name: gb-top;
  view-transition-class: persistent;
}
.gb-rail-area {
  view-transition-name: gb-rail;
  view-transition-class: persistent;
}
.gb-bar {
  view-transition-name: gb-bar;
  view-transition-class: persistent;
}
.gb-pager-top .gb-pager-prev {
  view-transition-name: gb-pager-prev;
  view-transition-class: persistent pager;
}
.gb-pager-top .gb-pager-next {
  view-transition-name: gb-pager-next;
  view-transition-class: persistent pager;
}
.gb-pager-top .gb-pager-prev .gb-pager-title {
  view-transition-name: gb-pager-prev-title;
  view-transition-class: page;
}
.gb-pager-top .gb-pager-next .gb-pager-title {
  view-transition-name: gb-pager-next-title;
  view-transition-class: page;
}
::view-transition-old(*.persistent) {
  display: none;
}
::view-transition-group(*.persistent),
::view-transition-new(*.persistent),
::view-transition-group(root),
::view-transition-old(root),
::view-transition-new(root) {
  animation: none;
}
::view-transition-group(gb-pager-prev-title),
::view-transition-group(gb-pager-next-title) {
  animation: none;
}
::view-transition-old(gb-pager-prev-title),
::view-transition-new(gb-pager-prev-title),
::view-transition-old(gb-pager-next-title),
::view-transition-new(gb-pager-next-title) {
  inline-size: auto;
  block-size: auto;
}
::view-transition-old(gb-pager-next-title),
::view-transition-new(gb-pager-next-title) {
  inset-inline: auto 0;
}
::view-transition-old(*.pager):only-child {
  display: block;
  animation: gb-vt-fade-out var(--gb-vt-exit) var(--md-sys-motion-easing-emphasized-accelerate, ease-in) both;
}
::view-transition-new(*.pager):only-child {
  animation: gb-vt-fade-in var(--gb-vt-enter) var(--md-sys-motion-easing-emphasized-decelerate, ease-out) var(--gb-vt-exit) both;
}
::view-transition-group(gb-page) {
  overflow: clip;
  border-radius: var(--md-sys-shape-corner-xl);
  background-color: var(--md-sys-color-surface);
}
@media (max-width: 599px) {
  ::view-transition-group(gb-page) {
    border-radius: 0;
  }
}
::view-transition-group(*.outline) {
  animation-duration: var(--gb-vt-enter);
}
::view-transition-old(*.outline) {
  animation: gb-vt-fade-out var(--gb-vt-exit) var(--md-sys-motion-easing-emphasized-accelerate, ease-in) both, gb-vt-collapse var(--gb-vt-exit) var(--md-sys-motion-easing-emphasized-accelerate, ease-in) both;
}
::view-transition-new(*.outline) {
  animation: gb-vt-fade-in var(--gb-vt-enter) var(--md-sys-motion-easing-emphasized-decelerate, ease-out) var(--gb-vt-exit) both, gb-vt-expand var(--gb-vt-enter) var(--md-sys-motion-easing-emphasized-decelerate, ease-out) var(--gb-vt-exit) both;
}
@keyframes gb-vt-collapse {
  to {
    clip-path: inset(0 0 100% 0);
  }
}
@keyframes gb-vt-expand {
  from {
    clip-path: inset(0 0 100% 0);
  }
}
@media (prefers-reduced-motion: reduce) {
  ::view-transition-old(*.outline) {
    animation: gb-vt-fade-out var(--gb-vt-exit) linear both;
  }
  ::view-transition-new(*.outline) {
    animation: gb-vt-fade-in var(--gb-vt-enter) linear var(--gb-vt-exit) both;
  }
}
::view-transition-group(*.page) {
  animation-duration: var(--gb-vt-enter);
}
::view-transition-old(*.page) {
  animation: gb-vt-fade-out var(--gb-vt-exit) var(--md-sys-motion-easing-emphasized-accelerate, ease-in) both;
}
::view-transition-new(*.page) {
  animation: gb-vt-fade-in var(--gb-vt-enter) var(--md-sys-motion-easing-emphasized-decelerate, ease-out) var(--gb-vt-exit) both;
}
html:active-view-transition-type(forward)::view-transition-old(*.page) {
  animation: gb-vt-fade-out var(--gb-vt-exit) var(--md-sys-motion-easing-emphasized-accelerate, ease-in) both, gb-vt-slide-to-start var(--gb-vt-slide) var(--md-sys-motion-easing-emphasized, ease) both;
}
html:active-view-transition-type(forward)::view-transition-new(*.page) {
  animation: gb-vt-fade-in var(--gb-vt-enter) var(--md-sys-motion-easing-emphasized-decelerate, ease-out) var(--gb-vt-exit) both, gb-vt-slide-from-end var(--gb-vt-slide) var(--md-sys-motion-easing-emphasized, ease) both;
}
html:active-view-transition-type(backward)::view-transition-old(*.page) {
  animation: gb-vt-fade-out var(--gb-vt-exit) var(--md-sys-motion-easing-emphasized-accelerate, ease-in) both, gb-vt-slide-to-end var(--gb-vt-slide) var(--md-sys-motion-easing-emphasized, ease) both;
}
html:active-view-transition-type(backward)::view-transition-new(*.page) {
  animation: gb-vt-fade-in var(--gb-vt-enter) var(--md-sys-motion-easing-emphasized-decelerate, ease-out) var(--gb-vt-exit) both, gb-vt-slide-from-start var(--gb-vt-slide) var(--md-sys-motion-easing-emphasized, ease) both;
}
@keyframes gb-vt-fade-out {
  to {
    opacity: 0;
  }
}
@keyframes gb-vt-fade-in {
  from {
    opacity: 0;
  }
}
@keyframes gb-vt-slide-to-start {
  to {
    translate: calc(-1 * var(--gb-vt-shift)) 0;
  }
}
@keyframes gb-vt-slide-from-end {
  from {
    translate: var(--gb-vt-shift) 0;
  }
}
@keyframes gb-vt-slide-to-end {
  to {
    translate: var(--gb-vt-shift) 0;
  }
}
@keyframes gb-vt-slide-from-start {
  from {
    translate: calc(-1 * var(--gb-vt-shift)) 0;
  }
}
.gb-route {
  position: sticky;
  inset-block-start: 0;
  z-index: 19;
  block-size: 0;
  pointer-events: none;
  view-transition-name: gb-route;
  opacity: 1;
  transition: opacity var(--md-sys-motion-duration-short4, 200ms) var(--md-sys-motion-easing-standard, ease);
}
.gb-route[data-out] {
  opacity: 0;
}
.gb-route[data-stage=loading] > * {
  position: absolute;
  inset-block-start: var(--md-sys-space-100, 8px);
  inset-inline-start: 50%;
  translate: -50% 0;
}
.gb-route[data-stage=linear] > * {
  position: absolute;
  inset-block-start: 0;
  inset-inline: 0;
}
.gb-route md-gb-progress {
  display: block;
  inline-size: 100%;
}
@media (prefers-reduced-motion: reduce) {
  .gb-route {
    transition: none;
  }
}

/* src/gb/search.css */
.gb-search-keys kbd {
  padding: 2px 6px;
  border: 1px solid var(--md-sys-color-outline-variant);
  border-radius: var(--md-sys-shape-corner-xs);
  font: var(--md-sys-typescale-label-md, 500 0.75rem/1 sans-serif);
  font-variation-settings: var(--md-sys-typescale-label-md-axes);
  color: var(--md-sys-color-on-surface-variant);
  white-space: nowrap;
}
.gb-search {
  position: fixed;
  inset: 0;
  inline-size: 100%;
  block-size: 100%;
  max-inline-size: none;
  max-block-size: none;
  margin: 0;
  padding: 0;
  border: 0;
  overflow: hidden;
  background: transparent;
  color: var(--md-sys-color-on-surface);
}
.gb-search:not([open]) {
  display: none;
}
.gb-search::backdrop {
  background: color-mix(in srgb, var(--md-sys-color-scrim, #000) 32%, transparent);
}
.gb-search-container {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  background: var(--md-sys-color-surface);
}
.gb-search-header {
  display: flex;
  flex: none;
  align-items: center;
  gap: var(--md-sys-space-100);
  block-size: 56px;
  padding-inline: var(--md-sys-space-100);
  border-block-end: 1px solid var(--md-sys-color-outline-variant);
}
.gb-search-lead {
  display: none;
  margin-inline-start: var(--md-sys-space-150);
  color: var(--md-sys-color-on-surface-variant);
}
.gb-search-input {
  flex: 1;
  min-inline-size: 0;
  block-size: 100%;
  padding: 0 var(--md-sys-space-100);
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--md-sys-color-on-surface);
  caret-color: var(--md-sys-color-primary);
  font: var(--md-sys-typescale-body-lg);
  font-variation-settings: var(--md-sys-typescale-body-lg-axes);
}
.gb-search-input::placeholder {
  color: var(--md-sys-color-on-surface-variant);
}
.gb-search-header [hidden] {
  display: none;
}
.gb-search-body {
  flex: 1;
  min-block-size: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-block: var(--md-sys-space-100);
}
.gb-search-group-title {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--md-sys-space-100);
  padding: var(--md-sys-space-150) var(--md-sys-space-300) var(--md-sys-space-50);
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-title-sm);
  font-variation-settings: var(--md-sys-typescale-title-sm-axes);
}
.gb-search-group-name {
  color: var(--md-sys-color-on-surface);
}
.gb-search-group-section {
  font: var(--md-sys-typescale-label-md, 500 0.75rem/1 sans-serif);
  font-variation-settings: var(--md-sys-typescale-label-md-axes);
}
.gb-search-option {
  display: flex;
  flex-direction: column;
  gap: 2px;
  margin-inline: var(--md-sys-space-100);
  padding: var(--md-sys-space-100) var(--md-sys-space-200);
  border-radius: var(--md-sys-shape-corner-md);
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  scroll-margin-block: var(--md-sys-space-100);
}
.gb-search-option[aria-selected=true] {
  background: var(--md-sys-color-secondary-container);
  color: var(--md-sys-color-on-secondary-container);
}
.gb-search-name {
  font: var(--md-sys-typescale-title-md);
  font-variation-settings: var(--md-sys-typescale-title-md-axes);
}
.gb-search-snippet {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-body-md);
  font-variation-settings: var(--md-sys-typescale-body-md-axes);
}
.gb-search-option[aria-selected=true] .gb-search-snippet {
  color: inherit;
}
.gb-search-option mark {
  padding: 0 1px;
  border-radius: 2px;
  background: color-mix(in srgb, var(--md-sys-color-primary) 22%, transparent);
  color: inherit;
  font-weight: 600;
}
.gb-search-term {
  flex-direction: row;
  align-items: center;
  gap: var(--md-sys-space-200);
  min-block-size: 48px;
}
.gb-search-term md-gb-icon {
  color: var(--md-sys-color-on-surface-variant);
}
.gb-search-action {
  flex-direction: row;
  align-items: center;
  gap: var(--md-sys-space-200);
  min-block-size: 56px;
}
.gb-search-action md-gb-icon {
  flex: none;
  color: var(--md-sys-color-on-surface-variant);
}
.gb-search-option[aria-selected=true] md-gb-icon {
  color: inherit;
}
.gb-search-action-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-inline-size: 0;
}
.gb-search-term-text {
  font: var(--md-sys-typescale-body-lg);
  font-variation-settings: var(--md-sys-typescale-body-lg-axes);
}
.gb-search-empty {
  padding: var(--md-sys-space-400) var(--md-sys-space-300);
  color: var(--md-sys-color-on-surface-variant);
  text-align: center;
}
.gb-search-empty[hidden] {
  display: none;
}
.gb-search-empty p {
  margin: 0;
}
.gb-search-empty-title {
  color: var(--md-sys-color-on-surface);
  font: var(--md-sys-typescale-title-md);
  font-variation-settings: var(--md-sys-typescale-title-md-axes);
}
.gb-search-empty-hint {
  margin-block-start: var(--md-sys-space-100);
  font: var(--md-sys-typescale-body-md);
  font-variation-settings: var(--md-sys-typescale-body-md-axes);
}
.gb-search-footer {
  display: none;
  flex: none;
  align-items: center;
  justify-content: space-between;
  gap: var(--md-sys-space-200);
  padding: var(--md-sys-space-100) var(--md-sys-space-300);
  border-block-start: 1px solid var(--md-sys-color-outline-variant);
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-label-md, 500 0.75rem/1 sans-serif);
  font-variation-settings: var(--md-sys-typescale-label-md-axes);
}
.gb-search-keys kbd {
  margin-inline-end: 2px;
}
.gb-search-keys kbd + kbd {
  margin-inline-start: 0;
}
.gb-search-recent-clear {
  padding: var(--md-sys-space-50) var(--md-sys-space-150);
  border: 0;
  border-radius: var(--md-sys-shape-corner-full);
  background: transparent;
  color: var(--md-sys-color-primary);
  font: var(--md-sys-typescale-label-lg);
  font-variation-settings: var(--md-sys-typescale-label-lg-axes);
  cursor: pointer;
}
.gb-search-recent-clear:hover {
  background: color-mix(in srgb, var(--md-sys-color-primary) 8%, transparent);
}
.gb-search-recent-clear:focus-visible {
  outline: 2px solid var(--md-sys-color-primary);
}
.gb-search-recent-clear[hidden] {
  display: none;
}
.gb-search-footer:has(.gb-search-recent-clear:not([hidden])) {
  display: flex;
}
.gb-search-status {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
@media (min-width: 600px) {
  .gb-search-container {
    inset: auto;
    inset-block-start: min(12vh, 96px);
    inset-inline: 0;
    margin-inline: auto;
    inline-size: min(720px, 100% - 32px);
    max-block-size: min(70dvh, 640px);
    border-radius: var(--md-sys-shape-corner-xl);
    background: var(--md-sys-color-surface-container-high);
    box-shadow: var(--md-sys-elevation-shadow-3, 0 4px 16px rgb(0 0 0 / 0.25));
    overflow: hidden;
  }
  .gb-search-back {
    display: none;
  }
  .gb-search-lead {
    display: inline-flex;
  }
  .gb-search-header {
    padding-inline: var(--md-sys-space-100);
  }
}
@media (min-width: 600px) and (hover: hover) {
  .gb-search-footer {
    display: flex;
  }
}
@media (min-width: 600px) and (hover: none) {
  .gb-search-keys {
    display: none;
  }
}
@media (prefers-reduced-motion: no-preference) {
  .gb-search[open] .gb-search-container {
    transition: opacity var(--md-sys-motion-duration-short3, 150ms) var(--md-sys-motion-easing-standard, ease-out), translate var(--md-sys-motion-duration-medium1, 250ms) var(--md-sys-motion-easing-emphasized, ease-out);
    @starting-style {
      opacity: 0;
      translate: 0 -8px;
    }
  }
}
.gb-search-hit {
  border-radius: var(--md-sys-shape-corner-sm);
  background: var(--md-sys-color-tertiary-container);
  box-shadow: 0 0 0 8px var(--md-sys-color-tertiary-container);
}
@media (prefers-reduced-motion: no-preference) {
  .gb-search-hit {
    animation: gb-search-hit 2.4s var(--md-sys-motion-easing-standard, ease-out) both;
  }
}
@keyframes gb-search-hit {
  0%, 35% {
    background: var(--md-sys-color-tertiary-container);
    box-shadow: 0 0 0 8px var(--md-sys-color-tertiary-container);
  }
  100% {
    background: transparent;
    box-shadow: 0 0 0 8px transparent;
  }
}
@media (forced-colors: active) {
  .gb-search-option[aria-selected=true] {
    outline: 2px solid Highlight;
  }
  .gb-search-hit {
    outline: 2px solid Highlight;
  }
}

/* src/gb/shell.css */
@property --gb-rail-w { syntax: "<length>"; inherits: false; initial-value: 0px; }
@property --gb-outline-w { syntax: "<length>"; inherits: false; initial-value: 0px; }
:root {
  --gb-top-h: 64px;
  --gb-rail-collapsed-w: 96px;
  --gb-rail-open-w: 280px;
  --gb-outline-open-w: clamp(12.5rem, 18vw, 15rem);
  --gb-bar-h: 80px;
  --gb-rail-motion: var(--md-sys-motion-spring-slow-spatial-duration, 570ms) var(--md-sys-motion-spring-slow-spatial, ease);
}
@media (min-width: 600px) {
  :is(.gb-shell, .gb-rail, .gb-rail-foot) {
    --gb-rail-w: var(--gb-rail-collapsed-w);
  }
}
@media (min-width: 840px) {
  :root:not([data-rail=collapsed]) :is(.gb-shell, .gb-rail, .gb-rail-foot) {
    --gb-rail-w: var(--gb-rail-open-w);
  }
  .gb-shell {
    --gb-outline-w: var(--gb-outline-open-w);
  }
  :root[data-outline=closed] .gb-shell {
    --gb-outline-w: 56px;
  }
}
.gb-shell-root,
.gb-shell-root body {
  block-size: 100dvh;
  overflow: hidden;
}
.gb-shell-root {
  scrollbar-gutter: auto;
}
.gb-shell-root body {
  background: var(--md-sys-color-surface-container);
}
.gb-shell {
  display: grid;
  grid-template-columns: var(--gb-rail-w) minmax(0, 1fr) var(--gb-outline-w);
  grid-template-rows: var(--gb-top-h) minmax(0, 1fr);
  block-size: 100dvh;
  transition: grid-template-columns var(--gb-rail-motion);
}
.gb-top {
  grid-column: 1 / -1;
  grid-row: 1;
  position: sticky;
  inset-block-start: 0;
  z-index: 30;
  block-size: var(--gb-top-h);
  background: var(--md-sys-color-surface-container);
}
.gb-appbar {
  display: block;
  block-size: 100%;
  --container-color: transparent;
}
.gb-appbar::part(app-bar) {
  --container-color: transparent;
  --on-scroll-container-color: transparent;
  --search-container-color: var(--md-sys-color-surface-container-highest);
  --search-on-scroll-container-color: var(--md-sys-color-surface-container-highest);
}
@media (min-width: 600px) {
  .gb-appbar::part(app-bar) {
    --leading-space: calc(var(--gb-rail-collapsed-w) / 2 - 20px);
  }
}
.gb-appbar:not(:defined) {
  visibility: hidden;
}
@media (max-width: 839px) {
  .gb-appbar > [data-tool=download] {
    display: none;
  }
}
@media (min-width: 840px) {
  .gb-appbar > #gb-overflow {
    display: none;
  }
}
.gb-searchbar {
  display: flex;
  align-items: center;
  gap: var(--md-sys-space-200);
  inline-size: 100%;
  block-size: 100%;
  padding-inline: var(--md-sys-space-100) var(--md-sys-space-200);
  border: 0;
  border-radius: inherit;
  background: none;
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-body-lg);
  font-variation-settings: var(--md-sys-typescale-body-lg-axes);
  letter-spacing: var(--md-sys-typescale-body-lg-tracking);
  text-align: start;
  cursor: text;
}
.gb-searchbar:focus-visible {
  outline: 3px solid var(--md-sys-color-secondary);
  outline-offset: 2px;
}
.gb-searchbar-icon {
  display: inline-flex;
  padding-inline-start: var(--md-sys-space-100);
  color: var(--md-sys-color-on-surface);
}
.gb-searchbar-text {
  flex: 1;
  min-inline-size: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.gb-search-hint {
  padding: 0 var(--md-sys-space-100);
  border-radius: var(--md-sys-shape-corner-xs);
  background: var(--md-sys-color-surface-container-highest);
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-label-md);
  font-variation-settings: var(--md-sys-typescale-label-md-axes);
}
.gb-search-hint:empty {
  display: none;
}
@media (max-width: 599px) {
  .gb-search-hint {
    display: none;
  }
}
.gb-rail-area {
  grid-column: 1;
  grid-row: 2;
  position: sticky;
  inset-block-start: var(--gb-top-h);
  z-index: 20;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  block-size: calc(100dvh - var(--gb-top-h));
  min-inline-size: 0;
  color: var(--md-sys-color-on-surface);
}
@media (max-width: 599px) {
  .gb-rail-area {
    display: none;
  }
}
@media (min-width: 840px) {
  .gb-rail-area {
    overflow: clip;
  }
}
.gb-rail:not([modal])::part(nav-rail) {
  transition: none;
}
.gb-rail {
  flex: 1 1 auto;
  min-block-size: 0;
  inline-size: var(--gb-rail-w);
}
.gb-rail:not([modal][expanded])::part(nav-rail) {
  --container-color: transparent;
  --expanded-container-color: transparent;
}
.gb-rail::part(nav-rail) {
  --collapsed-top-space: 8px;
  --expanded-top-space: 8px;
  --expanded-container-width-minimum: var(--gb-rail-open-w);
  --expanded-container-width-maximum: var(--gb-rail-open-w);
  block-size: 100%;
}
.gb-rail[expanded]::part(header) {
  margin-block-end: calc(var(--md-sys-space-500) - 6px);
}
.gb-rail::part(items) {
  min-block-size: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-block-end: var(--md-sys-space-200);
  scrollbar-width: thin;
  scrollbar-color: var(--md-sys-color-outline) transparent;
}
.gb-rail:not(:defined) {
  display: block;
  visibility: hidden;
}
@media (max-width: 839px) {
  .gb-rail-area {
    z-index: 40;
  }
}
.gb-rail > .gb-rail-group {
  display: none;
  flex: none;
  box-sizing: border-box;
  inline-size: auto;
  margin-inline: var(--md-sys-space-200);
  block-size: var(--active-indicator-height, 56px);
}
.gb-rail[expanded] > .gb-rail-group:not([hidden]) {
  display: flex;
}
.gb-rail > md-gb-nav-rail-item[hidden] {
  display: none;
}
.gb-rail > md-gb-nav-rail-item[secondary] {
  inline-size: auto;
  margin-inline-start: var(--md-sys-space-400);
}
.gb-rail > md-gb-nav-rail-item[secondary]::part(nav-rail-item) {
  --item-icon-size: 0px;
  --item-horizontal-icon-label-space: 0px;
}
.gb-rail[expanded] > md-gb-nav-rail-item {
  inline-size: auto;
  margin-inline-end: var(--md-sys-space-200);
}
.gb-rail[expanded] > md-gb-nav-rail-item[data-section] {
  margin-inline-end: calc(var(--md-sys-space-200) + 56px + var(--md-sys-space-25));
}
.gb-rail > md-gb-nav-rail-item::part(nav-rail-item) {
  --item-horizontal-active-indicator-width: 100%;
}
.gb-rail-foot {
  flex: none;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--md-sys-space-100);
  inline-size: var(--gb-rail-w);
  padding-block: var(--md-sys-space-100) var(--md-sys-space-200);
}
.gb-rail-links {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--md-sys-space-50);
}
.gb-rail[expanded]:not([modal]) ~ .gb-rail-foot {
  flex-direction: row;
  justify-content: space-between;
  padding-inline: var(--md-sys-space-250, 20px);
}
.gb-rail[expanded]:not([modal]) ~ .gb-rail-foot .gb-rail-links {
  flex-direction: row;
}
.gb-rail-foot :not(:defined) {
  visibility: hidden;
}
.gb-version {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--md-sys-space-50);
  cursor: pointer;
}
.gb-rail[expanded]:not([modal]) ~ .gb-rail-foot .gb-version {
  flex-direction: row;
  gap: var(--md-sys-space-150);
}
.gb-version-label {
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-label-lg);
  font-variation-settings: var(--md-sys-typescale-label-lg-axes);
}
.gb-brand {
  display: grid;
  place-items: center;
  inline-size: 40px;
  block-size: 40px;
  border-radius: var(--md-sys-shape-corner-full);
  color: var(--md-sys-color-on-surface);
}
.gb-brand:focus-visible {
  outline: 3px solid var(--md-sys-color-secondary);
  outline-offset: 2px;
}
.gb-brand svg {
  display: block;
}
md-gb-nav-drawer {
  --section-label-height: 48px;
}
md-gb-nav-drawer .nav-drawer-section-label {
  align-items: flex-end;
  padding-block-end: var(--md-sys-space-100);
}
.gb-pane-group {
  display: flex;
  block-size: var(--active-indicator-height, 56px);
}
.gb-pane-group-toggle {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  gap: var(--md-sys-space-150);
  min-inline-size: 0;
  padding-inline: var(--md-sys-space-200);
  border: 0;
  border-radius: var(--md-sys-shape-corner-full);
  background: none;
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-label-lg);
  font-variation-settings: var(--md-sys-typescale-label-lg-axes);
  text-align: start;
  cursor: pointer;
  outline: none;
  isolation: isolate;
}
.gb-pane-group-label {
  flex: 1;
  min-inline-size: 0;
}
md-gb-nav-drawer-item[data-group] {
  margin-inline-start: var(--md-sys-space-150);
}
.gb-rail > .gb-rail-section-toggle {
  display: none;
}
.gb-rail[expanded] > .gb-rail-section-toggle {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  flex: none;
  align-self: flex-end;
  inline-size: var(--active-indicator-height, 56px);
  block-size: var(--active-indicator-height, 56px);
  margin-block-start: calc(-1 * var(--active-indicator-height, 56px));
  margin-inline-end: var(--md-sys-space-200);
  padding: 0;
  border: 0;
  border-radius: var(--md-sys-shape-corner-full);
  background: none;
  color: var(--md-sys-color-on-surface-variant);
  cursor: pointer;
  outline: none;
  isolation: isolate;
}
.gb-pane-group-toggle::before,
.gb-rail-section-toggle::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: currentColor;
  opacity: 0;
}
.gb-pane-group-toggle:hover::before,
.gb-rail-section-toggle:hover::before {
  opacity: 0.08;
}
.gb-pane-group-toggle:focus-visible::before,
.gb-pane-group-toggle:active::before,
.gb-rail-section-toggle:focus-visible::before,
.gb-rail-section-toggle:active::before {
  opacity: 0.1;
}
.gb-pane-group-toggle:focus-visible,
.gb-rail-section-toggle:focus-visible {
  outline: 3px solid var(--md-sys-color-secondary);
  outline-offset: 2px;
}
.gb-pane-group-toggle md-gb-icon,
.gb-rail-section-toggle md-gb-icon {
  transition: rotate var(--md-sys-motion-spring-fast-spatial-duration, 200ms) var(--md-sys-motion-spring-fast-spatial, ease);
}
.gb-pane-group-toggle[aria-expanded=true] md-gb-icon,
.gb-rail-section-toggle[aria-expanded=true] md-gb-icon {
  rotate: 180deg;
}
@media (prefers-reduced-motion: reduce) {
  .gb-pane-group-toggle md-gb-icon,
  .gb-rail-section-toggle md-gb-icon {
    transition: none;
  }
}
.gb-content-pane {
  grid-column: 2;
  grid-row: 2;
  position: relative;
  min-inline-size: 0;
  min-block-size: 0;
  margin: 0 var(--md-sys-space-150) var(--md-sys-space-150);
  border-radius: var(--md-sys-shape-corner-xl);
  background: var(--md-sys-color-surface);
  overflow-y: auto;
  overscroll-behavior: contain;
  scroll-padding-block-start: var(--md-sys-space-200);
}
.gb-body {
  container-type: inline-size;
}
.gb-main {
  padding-block-end: var(--md-sys-space-800);
}
@media (min-width: 840px) {
  .gb-main {
    padding-inline: var(--md-sys-space-400);
  }
}
.gb-outline {
  display: none;
}
@media (min-width: 840px) {
  .gb-outline {
    grid-column: 3;
    grid-row: 2;
    display: flex;
    flex-direction: column;
    min-inline-size: 0;
    min-block-size: 0;
    margin: 0 var(--md-sys-space-150) var(--md-sys-space-150) 0;
    overflow: hidden;
  }
  :root[data-outline=closed] .gb-outline {
    display: none;
  }
}
.gb-outline > * {
  min-inline-size: calc(var(--gb-outline-open-w) - var(--md-sys-space-150));
}
.gb-outline-head {
  display: flex;
  align-items: center;
  gap: var(--md-sys-space-100);
  padding: var(--md-sys-space-150) var(--md-sys-space-100) var(--md-sys-space-50) var(--md-sys-space-200);
}
.gb-outline-title {
  flex: 1;
  margin: 0;
  font: var(--md-sys-typescale-title-sm);
  font-variation-settings: var(--md-sys-typescale-title-sm-axes);
  letter-spacing: var(--md-sys-typescale-title-sm-tracking);
}
.gb-outline-body {
  flex: 1;
  min-block-size: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-block-end: var(--md-sys-space-200);
}
.gb-outline-rail {
  display: flex;
  block-size: auto;
}
.gb-outline-rail::part(nav-rail) {
  --expanded-container-color: transparent;
  --expanded-top-space: 0px;
  --expanded-container-width-minimum: 100%;
  --expanded-container-width-maximum: 100%;
  --item-outer-space: 0px;
}
.gb-outline-rail > md-gb-nav-rail-item {
  overflow-wrap: anywhere;
}
.gb-outline-rail > md-gb-nav-rail-item::part(nav-rail-item) {
  --item-icon-size: 0px;
  --item-horizontal-icon-label-space: 0px;
  --item-horizontal-active-indicator-width: 100%;
}
.gb-outline-rail > md-gb-nav-rail-item[data-depth="2"] {
  inline-size: auto;
  margin-inline-start: var(--md-sys-space-200);
}
.gb-outline-rail > md-gb-nav-rail-item[data-depth="3"] {
  display: none;
}
.gb-outline-rail:not(:defined) {
  visibility: hidden;
}
.gb-outline-strip {
  display: none;
}
@media (min-width: 840px) {
  :root[data-outline=closed] .gb-outline-strip {
    grid-column: 3;
    grid-row: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-block-start: var(--md-sys-space-100);
  }
}
.gb-outline-strip > :not(:defined) {
  visibility: hidden;
}
.gb-outline-fab {
  position: fixed;
  inset-inline-end: var(--md-sys-space-200);
  inset-block-end: var(--md-sys-space-200);
  z-index: 15;
}
.gb-outline-fab:not(:defined) {
  visibility: hidden;
}
@media (max-width: 599px) {
  .gb-outline-fab {
    inset-block-end: calc(var(--gb-bar-h) + var(--md-sys-space-200));
  }
}
@media (min-width: 840px) {
  .gb-outline-fab {
    display: none;
  }
}
.gb-sheet-outline {
  padding: 0 var(--md-sys-space-200) var(--md-sys-space-300);
}
.gb-sheet-title {
  margin: 0 0 var(--md-sys-space-100);
  font: var(--md-sys-typescale-title-md);
  font-variation-settings: var(--md-sys-typescale-title-md-axes);
  letter-spacing: var(--md-sys-typescale-title-md-tracking);
}
.gb-pager {
  display: flex;
  gap: var(--md-sys-space-200);
}
.gb-pager-link {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--md-sys-space-100);
  min-inline-size: 0;
  color: var(--md-sys-color-on-surface);
  text-decoration: none;
  isolation: isolate;
}
.gb-pager-next {
  margin-inline-start: auto;
  text-align: end;
}
.gb-pager-text {
  display: flex;
  flex-direction: column;
  min-inline-size: 0;
}
.gb-pager-title {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.gb-pager-icon {
  display: inline-flex;
  flex: none;
}
.gb-pager-link::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: currentColor;
  opacity: 0;
}
.gb-pager-link:hover::before {
  opacity: 0.08;
}
.gb-pager-link:focus-visible::before,
.gb-pager-link:active::before {
  opacity: 0.1;
}
.gb-pager-link:focus-visible {
  outline: 3px solid var(--md-sys-color-secondary);
  outline-offset: 2px;
}
.gb-pager .gb-pager-link {
  flex: 1 1 0;
  max-inline-size: calc(50% - var(--md-sys-space-100));
  gap: var(--md-sys-space-200);
  min-block-size: 80px;
  padding: var(--md-sys-space-200) var(--md-sys-space-300);
  border: 1px solid var(--md-sys-color-outline-variant);
  border-radius: var(--md-sys-shape-corner-lg);
}
.gb-pager .gb-pager-label {
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-label-md);
  font-variation-settings: var(--md-sys-typescale-label-md-axes);
}
.gb-pager .gb-pager-title {
  font: var(--md-sys-typescale-title-md);
  font-variation-settings: var(--md-sys-typescale-title-md-axes);
}
.gb-pager .gb-pager-next {
  justify-content: flex-end;
}
.gb-pager .gb-pager-icon {
  color: var(--md-sys-color-primary);
}
.gb-pager-top {
  margin-block: var(--md-sys-space-200) var(--md-sys-space-300);
  margin-inline: calc((100% - 100cqi) / 2 + var(--md-sys-space-200));
}
.gb-pager-end {
  margin-block-start: var(--md-sys-space-600);
  padding-block-start: var(--md-sys-space-300);
  border-block-start: 1px solid var(--md-sys-color-outline-variant);
}
.gb-bar-area,
.gb-bar {
  display: none;
}
@media (max-width: 599px) {
  .gb-shell {
    grid-template-columns: minmax(0, 1fr);
  }
  .gb-content-pane {
    grid-column: 1;
    margin: 0;
    border-radius: 0;
    padding-block-end: var(--gb-bar-h);
  }
  .gb-bar-area {
    display: contents;
  }
  .gb-bar {
    display: flex;
    position: fixed;
    inset-inline: 0;
    inset-block-end: 0;
    z-index: 15;
  }
  .gb-bar:not(:defined) {
    display: block;
    block-size: var(--gb-bar-h);
    visibility: hidden;
  }
}
.gb-tools {
  display: none;
}
.gb-side-sheet {
  --container-width: 360px;
}
.gb-tool {
  padding-block-end: var(--md-sys-space-300);
}
.gb-tool-title {
  margin: 0 0 var(--md-sys-space-150);
  font: var(--md-sys-typescale-headline-sm);
  font-variation-settings: var(--md-sys-typescale-headline-sm-axes);
}
md-gb-side-sheet .gb-tool-title {
  display: none;
}
md-gb-bottom-sheet .gb-tool {
  padding-inline: var(--md-sys-space-200);
}
.gb-tool-group {
  margin: var(--md-sys-space-200) 0 var(--md-sys-space-50);
  font: var(--md-sys-typescale-title-sm);
  font-variation-settings: var(--md-sys-typescale-title-sm-axes);
  color: var(--md-sys-color-on-surface-variant);
}
.gb-tool-note {
  margin: 0 0 var(--md-sys-space-200);
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-body-md);
  font-variation-settings: var(--md-sys-typescale-body-md-axes);
}
.gb-actions {
  list-style: none;
  margin: 0;
  padding: 0;
}
.gb-actions li[hidden] {
  display: none;
}
.gb-actions-divider {
  margin-block: var(--md-sys-space-100);
}
.gb-action {
  display: flex;
  align-items: center;
  gap: var(--md-sys-space-200);
  inline-size: 100%;
  min-block-size: 72px;
  margin: 0;
  padding: var(--md-sys-space-100) var(--md-sys-space-150);
  border: 0;
  border-radius: var(--md-sys-shape-corner-md);
  background: transparent;
  color: var(--md-sys-color-on-surface);
  font: inherit;
  text-align: start;
  cursor: pointer;
  transition: background-color var(--md-sys-motion-duration-short3, 150ms);
}
.gb-action:hover {
  background: color-mix(in srgb, var(--md-sys-color-on-surface) 8%, transparent);
}
.gb-action:active {
  background: color-mix(in srgb, var(--md-sys-color-on-surface) 10%, transparent);
}
.gb-action:focus-visible {
  outline: 3px solid var(--md-sys-color-secondary);
  outline-offset: -3px;
}
.gb-action > md-gb-icon {
  flex: none;
  color: var(--md-sys-color-on-surface-variant);
}
.gb-action-text {
  display: flex;
  flex-direction: column;
  min-inline-size: 0;
}
.gb-action-label {
  font: var(--md-sys-typescale-body-lg);
  font-variation-settings: var(--md-sys-typescale-body-lg-axes);
}
.gb-action-support {
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-body-md);
  font-variation-settings: var(--md-sys-typescale-body-md-axes);
  overflow-wrap: anywhere;
}
.gb-field {
  min-inline-size: 0;
  margin: 0 0 var(--md-sys-space-300);
  padding: 0;
  border: 0;
}
.gb-field > legend {
  padding: 0;
  margin-block-end: var(--md-sys-space-100);
  font: var(--md-sys-typescale-title-sm);
  font-variation-settings: var(--md-sys-typescale-title-sm-axes);
  color: var(--md-sys-color-on-surface-variant);
}
.gb-swatches {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(3.5rem, 1fr));
  gap: var(--md-sys-space-150);
}
.gb-swatch {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--md-sys-space-50);
  padding: var(--md-sys-space-100) 0;
  cursor: pointer;
}
.gb-swatch input {
  position: absolute;
  inset: 0;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}
.gb-swatch-chip {
  display: block;
  inline-size: 48px;
  block-size: 48px;
  border-radius: var(--md-sys-shape-corner-full);
  background: var(--gb-swatch);
  box-shadow: inset 0 0 0 1px var(--md-sys-color-outline-variant);
}
.gb-swatch input:checked + .gb-swatch-chip {
  outline: 3px solid var(--md-sys-color-primary);
  outline-offset: 3px;
}
.gb-swatch input:focus-visible + .gb-swatch-chip {
  outline: 3px solid var(--md-sys-color-secondary);
  outline-offset: 3px;
}
.gb-swatch-name {
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-label-md);
  font-variation-settings: var(--md-sys-typescale-label-md-axes);
}
.gb-custom-color {
  display: flex;
  align-items: center;
  gap: var(--md-sys-space-150);
  margin-block-start: var(--md-sys-space-150);
  font: var(--md-sys-typescale-body-lg);
  font-variation-settings: var(--md-sys-typescale-body-lg-axes);
}
.gb-custom-color input {
  inline-size: 48px;
  block-size: 48px;
  padding: 0;
  border: 0;
  border-radius: var(--md-sys-shape-corner-full);
  background: none;
  cursor: pointer;
}
.gb-custom-color input:focus-visible {
  outline: 3px solid var(--md-sys-color-secondary);
  outline-offset: 3px;
}
.gb-custom-color output {
  color: var(--md-sys-color-on-surface-variant);
  font-family:
    ui-monospace,
    "Roboto Mono",
    Menlo,
    Consolas,
    monospace;
  font-size: var(--md-sys-typescale-body-md-size, 0.875rem);
}
.gb-tool-actions {
  display: flex;
  justify-content: flex-end;
}
.gb-sheet-drawer {
  --container-width: 100%;
  --container-color: transparent;
  block-size: 52dvh;
  display: block;
  padding-inline: var(--md-sys-space-100);
}
.gb-pages-foot {
  display: flex;
  flex-wrap: wrap;
  gap: var(--md-sys-space-50) var(--md-sys-space-100);
  padding: var(--md-sys-space-150) var(--md-sys-space-200) var(--md-sys-space-300);
  border-block-start: 1px solid var(--md-sys-color-outline-variant);
}
.gb-feedback {
  display: grid;
  gap: var(--md-sys-space-200);
  min-inline-size: min(28rem, 100%);
}
.gb-feedback-note {
  margin: 0;
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-body-sm);
  font-variation-settings: var(--md-sys-typescale-body-sm-axes);
}
@media print {
  .gb-shell-root,
  .gb-shell-root body,
  .gb-shell {
    display: block;
    block-size: auto;
    overflow: visible;
  }
  .gb-content-pane {
    overflow: visible;
    margin: 0;
  }
  .gb-outline,
  .gb-outline-strip,
  .gb-outline-fab {
    display: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  .gb-shell,
  .gb-action {
    transition: none;
  }
}

/* src/gb/sections.css */
.gb-layout-index .gb-main {
  max-inline-size: 80rem;
}
md-gb-nav-drawer .nav-drawer-section-label a {
  color: inherit;
  text-decoration: none;
  border-radius: var(--md-sys-shape-corner-xs);
}
md-gb-nav-drawer .nav-drawer-section-label a:hover {
  text-decoration: underline;
}
md-gb-nav-drawer .nav-drawer-section-label a[aria-current=page] {
  color: var(--md-sys-color-on-surface);
}
md-gb-nav-drawer .nav-drawer-section-label a:focus-visible {
  outline: 3px solid var(--md-sys-color-secondary);
  outline-offset: 2px;
}
.gb-section [data-tone=primary] {
  --gb-tone: var(--md-sys-color-primary-container);
  --gb-on-tone: var(--md-sys-color-on-primary-container);
}
.gb-section [data-tone=secondary] {
  --gb-tone: var(--md-sys-color-secondary-container);
  --gb-on-tone: var(--md-sys-color-on-secondary-container);
}
.gb-section [data-tone=tertiary] {
  --gb-tone: var(--md-sys-color-tertiary-container);
  --gb-on-tone: var(--md-sys-color-on-tertiary-container);
}
.gb-shape {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  fill: currentColor;
}
.gb-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  align-items: flex-end;
  min-block-size: 20rem;
  padding: var(--md-sys-space-500) var(--md-sys-space-300);
  border-radius: var(--md-sys-shape-corner-xxl);
  background: var(--md-sys-color-surface-container-low);
  color: var(--md-sys-color-on-surface);
}
.gb-hero-art {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}
.gb-hero-shape {
  position: absolute;
  color: var(--gb-tone);
}
.gb-hero-shape[data-pos=a] {
  inline-size: 9rem;
  block-size: 9rem;
  inset-block-start: -1.5rem;
  inset-inline-end: -1.5rem;
}
.gb-hero-shape[data-pos=b] {
  inline-size: 5rem;
  block-size: 5rem;
  inset-block-start: 6.5rem;
  inset-inline-end: 6rem;
}
.gb-hero-shape[data-pos=c] {
  inline-size: 3.5rem;
  block-size: 3.5rem;
  inset-block-start: 1rem;
  inset-inline-end: 9rem;
}
.gb-hero-shape[data-pos=d] {
  display: none;
}
@media (min-width: 600px) {
  .gb-hero {
    padding: var(--md-sys-space-600) var(--md-sys-space-500);
    min-block-size: 22rem;
  }
  .gb-hero-shape[data-pos=a] {
    inline-size: 16rem;
    block-size: 16rem;
    inset-block-start: -2rem;
    inset-inline-end: 4rem;
  }
  .gb-hero-shape[data-pos=b] {
    inline-size: 10rem;
    block-size: 10rem;
    inset-block-start: 9rem;
    inset-inline-end: -2rem;
  }
  .gb-hero-shape[data-pos=c] {
    inline-size: 7rem;
    block-size: 7rem;
    inset-block-start: 1.5rem;
    inset-inline-end: 1.5rem;
  }
  .gb-hero-shape[data-pos=d] {
    display: block;
    inline-size: 12rem;
    block-size: 6rem;
    inset-block-end: -1.5rem;
    inset-inline-end: 12rem;
  }
}
.gb-hero-text {
  max-inline-size: 40rem;
}
.gb-hero-eyebrow {
  margin: 0 0 var(--md-sys-space-100);
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-label-lg);
  font-variation-settings: var(--md-sys-typescale-label-lg-axes);
  letter-spacing: var(--md-sys-typescale-label-lg-tracking);
}
.gb-hero h1 {
  margin: 0 0 var(--md-sys-space-200);
  font: var(--md-sys-typescale-display-md);
  font-variation-settings: var(--md-sys-typescale-display-md-axes);
  letter-spacing: var(--md-sys-typescale-display-md-tracking);
}
@media (min-width: 600px) {
  .gb-hero h1 {
    font: var(--md-sys-typescale-display-lg);
    font-variation-settings: var(--md-sys-typescale-display-lg-axes);
    letter-spacing: var(--md-sys-typescale-display-lg-tracking);
  }
}
.gb-hero-intro {
  margin: 0;
  font: var(--md-sys-typescale-body-lg);
  font-variation-settings: var(--md-sys-typescale-body-lg-axes);
}
@media (max-width: 599px) {
  .gb-hero-intro {
    min-block-size: 5lh;
  }
}
.gb-hero-meta {
  margin: var(--md-sys-space-200) 0 0;
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-body-md);
  font-variation-settings: var(--md-sys-typescale-body-md-axes);
}
.gb-section .gb-hero-meta a {
  color: var(--md-sys-color-primary);
}
.gb-group {
  margin-block-start: var(--md-sys-space-500);
}
.gb-section .gb-group-title {
  margin: 0 0 var(--md-sys-space-200);
  font: var(--md-sys-typescale-headline-md);
  font-variation-settings: var(--md-sys-typescale-headline-md-axes);
}
.gb-cards {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--md-sys-space-200);
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (min-width: 600px) {
  .gb-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (min-width: 840px) {
  .gb-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (min-width: 1200px) {
  .gb-cards {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}
.gb-card {
  position: relative;
  isolation: isolate;
  display: grid;
  align-content: start;
  gap: var(--md-sys-space-50);
  padding: var(--md-sys-space-100);
  border-radius: var(--md-sys-shape-corner-xl);
  color: var(--md-sys-color-on-surface);
}
.gb-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: inherit;
  background: var(--md-sys-color-on-surface);
  opacity: 0;
  pointer-events: none;
}
@media (hover: hover) {
  .gb-card:hover::before {
    opacity: 0.08;
  }
}
.gb-card:has(.gb-card-link:focus-visible)::before {
  opacity: 0.1;
}
.gb-card:active::before {
  opacity: 0.1;
}
.gb-card:has(.gb-card-link:focus-visible) {
  outline: 3px solid var(--md-sys-color-secondary);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: no-preference) {
  .gb-card::before {
    transition: opacity var(--md-sys-motion-duration-short3) var(--md-sys-motion-easing-standard);
  }
}
.gb-card-media {
  position: relative;
  overflow: hidden;
  container-type: inline-size;
  aspect-ratio: 16 / 10;
  border-radius: var(--md-sys-shape-corner-lg);
  background: var(--md-sys-color-surface-container);
  margin-block-end: var(--md-sys-space-100);
}
@media (prefers-reduced-motion: no-preference) {
  .gb-card-media {
    transition: border-radius var(--md-sys-motion-spring-fast-spatial-duration) var(--md-sys-motion-spring-fast-spatial);
  }
  .gb-card:has(.gb-card-link:focus-visible) .gb-card-media {
    border-radius: var(--md-sys-shape-corner-xl-increased);
  }
}
@media (prefers-reduced-motion: no-preference) and (hover: hover) {
  .gb-card:hover .gb-card-media {
    border-radius: var(--md-sys-shape-corner-xl-increased);
  }
}
.gb-card-stage > md-gb-carousel {
  inline-size: 100%;
}
.gb-card-stage {
  position: absolute;
  inset-block-start: 50%;
  left: 50%;
  translate: -50% -50%;
  box-sizing: border-box;
  inline-size: 400px;
  block-size: 250px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  align-content: center;
  gap: 8px;
  padding: 16px;
  transform-origin: center;
  transform: scale(calc(tan(atan2(100cqw, 400px)) * var(--gb-z, 1)));
  pointer-events: none;
  user-select: none;
}
.gb-card-stage :not(:defined) {
  visibility: hidden;
}
.gb-card-art {
  display: grid;
  place-items: center;
}
.gb-card-shape {
  grid-area: 1 / 1;
  inline-size: 46cqw;
  block-size: 46cqw;
  max-block-size: 100%;
  color: var(--gb-tone);
}
.gb-card-icon {
  grid-area: 1 / 1;
  --md-icon-size: 14cqw;
  font-size: 14cqw;
  color: var(--gb-on-tone);
}
.gb-section .gb-card-title {
  margin: 0;
  padding-inline: var(--md-sys-space-100);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--md-sys-space-100);
  font: var(--md-sys-typescale-title-lg);
  font-variation-settings: var(--md-sys-typescale-title-lg-axes);
}
.gb-section .gb-card-link {
  color: inherit;
  text-decoration: none;
}
.gb-section .gb-card-link:focus-visible {
  outline: none;
}
.gb-card-link::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  border-radius: inherit;
}
.gb-card-chip {
  display: inline-flex;
  align-items: center;
  block-size: 24px;
  padding-inline: var(--md-sys-space-100);
  border: 1px solid var(--md-sys-color-outline-variant);
  border-radius: var(--md-sys-shape-corner-sm);
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-label-md);
  font-variation-settings: var(--md-sys-typescale-label-md-axes);
  white-space: nowrap;
}
.gb-section .gb-card-desc {
  margin: 0 var(--md-sys-space-100) var(--md-sys-space-100);
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-body-md);
  font-variation-settings: var(--md-sys-typescale-body-md-axes);
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
  overflow: hidden;
}

/* src/gb/home.css */
:is(.gb-home-blob, .gb-home-tile, .gb-home-decor, .gb-home-art-small)[data-tone=primary] {
  --gb-tone: var(--md-sys-color-primary-container);
  --gb-on-tone: var(--md-sys-color-on-primary-container);
}
:is(.gb-home-blob, .gb-home-tile, .gb-home-decor, .gb-home-art-small)[data-tone=secondary] {
  --gb-tone: var(--md-sys-color-secondary-container);
  --gb-on-tone: var(--md-sys-color-on-secondary-container);
}
:is(.gb-home-blob, .gb-home-tile, .gb-home-decor, .gb-home-art-small)[data-tone=tertiary] {
  --gb-tone: var(--md-sys-color-tertiary-container);
  --gb-on-tone: var(--md-sys-color-on-tertiary-container);
}
.gb-home-hero .gb-shape,
.gb-home-section .gb-shape {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  fill: currentColor;
}
.gb-home-hero {
  display: grid;
  gap: var(--md-sys-space-400);
  align-items: center;
  padding-block: var(--md-sys-space-400) var(--md-sys-space-600);
}
@container (min-width: 640px) {
  .gb-home-hero {
    grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  }
}
.gb-home-intro {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--md-sys-space-300);
}
.gb-home-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--md-sys-space-100);
  min-block-size: 32px;
  padding-inline: var(--md-sys-space-200) var(--md-sys-space-150);
  border-radius: var(--md-sys-shape-corner-full);
  background: var(--md-sys-color-secondary-container);
  color: var(--md-sys-color-on-secondary-container);
  font: var(--md-sys-typescale-label-lg);
  font-variation-settings: var(--md-sys-typescale-label-lg-axes);
  text-decoration: none;
}
.gb-home-chip md-gb-icon {
  --md-icon-size: 18px;
}
.gb-home-chip:hover {
  background: color-mix(in srgb, var(--md-sys-color-on-secondary-container) 8%, var(--md-sys-color-secondary-container));
}
.gb-home-chip:focus-visible {
  outline: 3px solid var(--md-sys-color-secondary);
  outline-offset: 2px;
}
.gb-home-title {
  margin: 0;
  font: var(--md-sys-typescale-display-lg);
  font-variation-settings: var(--md-sys-typescale-display-lg-axes);
  letter-spacing: var(--md-sys-typescale-display-lg-tracking);
  text-wrap: balance;
}
.gb-home-lede {
  margin: 0;
  max-inline-size: 36rem;
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-body-lg);
  font-variation-settings: var(--md-sys-typescale-body-lg-axes);
  text-wrap: pretty;
}
.gb-home-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--md-sys-space-150);
}
.gb-home-art {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 1;
  inline-size: min(100%, 26rem);
  justify-self: center;
}
.gb-home-blob {
  position: absolute;
  color: var(--gb-tone);
}
.gb-home-blob[data-pos=main] {
  inset: 12%;
  animation: gb-home-turn 60s linear infinite;
}
.gb-home-blob[data-pos=a] {
  inset-block-start: 0;
  inset-inline-end: 2%;
  inline-size: 34%;
  aspect-ratio: 1;
  animation: gb-home-turn 40s linear infinite reverse;
}
.gb-home-blob[data-pos=b] {
  inset-block-end: 2%;
  inset-inline-start: 0;
  inline-size: 30%;
  aspect-ratio: 1;
  animation: gb-home-turn 50s linear infinite;
}
.gb-home-blob[data-pos=c] {
  inset-block-end: 6%;
  inset-inline-end: 4%;
  inline-size: 30%;
  aspect-ratio: 2;
  rotate: -30deg;
}
.gb-home-blob[data-pos=d] {
  inset-block-start: 4%;
  inset-inline-start: 6%;
  inline-size: 16%;
  aspect-ratio: 1;
  animation: gb-home-turn 30s linear infinite reverse;
}
.gb-home-spinner {
  position: relative;
  --size: 120px;
}
@keyframes gb-home-turn {
  to {
    rotate: 1turn;
  }
}
@media (prefers-reduced-motion: reduce) {
  .gb-home-blob {
    animation: none;
  }
}
.gb-home-section {
  margin-block-start: var(--md-sys-space-600);
}
.gb-home-heading {
  margin: 0 0 var(--md-sys-space-300);
  font: var(--md-sys-typescale-headline-md);
  font-variation-settings: var(--md-sys-typescale-headline-md-axes);
}
.gb-home-carousel {
  --height: 260px;
  --item-width: 220px;
}
.gb-home-tile {
  position: relative;
  display: grid;
  place-items: center;
  inline-size: 100%;
  block-size: 100%;
  background: var(--gb-tone);
  color: var(--gb-on-tone);
  overflow: hidden;
}
.gb-home-tile-shape {
  position: absolute;
  inset: 14% 10%;
  inline-size: auto !important;
  block-size: auto !important;
  color: color-mix(in srgb, var(--gb-on-tone) 14%, var(--gb-tone));
}
.gb-home-tile-icon {
  position: relative;
  --md-icon-size: 64px;
}
.gb-home-cards {
  columns: 2 20rem;
  column-gap: var(--md-sys-space-200);
}
.gb-home-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--md-sys-space-200);
  margin-block-end: var(--md-sys-space-200);
  padding: var(--md-sys-space-300);
  border-radius: var(--md-sys-shape-corner-xl);
  background: var(--md-sys-color-surface-container-low);
  overflow: hidden;
  break-inside: avoid;
  isolation: isolate;
}
.gb-home-card[data-corners=a] {
  border-start-end-radius: var(--md-sys-shape-corner-xxl);
}
.gb-home-card[data-corners=b] {
  border-radius: var(--md-sys-shape-corner-xl-increased);
  border-end-start-radius: var(--md-sys-shape-corner-xxl);
}
.gb-home-card[data-corners=c] {
  border-radius: var(--md-sys-shape-corner-lg-increased);
  border-start-start-radius: var(--md-sys-shape-corner-xxl);
}
.gb-home-decor {
  position: absolute;
  inset-block-start: -2.5rem;
  inset-inline-end: -2.5rem;
  z-index: -1;
  inline-size: 8.5rem;
  aspect-ratio: 1;
  color: var(--gb-tone);
  opacity: 0.7;
}
.gb-home-decor[data-place=bottom] {
  inset-block: auto -2.5rem;
}
.gb-home-card-title {
  margin: 0;
  font: var(--md-sys-typescale-title-lg);
  font-variation-settings: var(--md-sys-typescale-title-lg-axes);
}
.gb-home-card p {
  margin: 0;
}
.gb-home-card md-gb-text-field,
.gb-home-card md-gb-slider,
.gb-home-card md-gb-progress,
.gb-home-wide {
  inline-size: 100%;
}
.gb-home-card md-gb-list {
  margin-inline: calc(-1 * var(--md-sys-space-300));
  background: transparent;
}
.gb-home-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--md-sys-space-100);
}
.gb-home-spread {
  justify-content: space-between;
}
.gb-home-center {
  justify-content: center;
}
.gb-home-end {
  justify-content: flex-end;
}
.gb-home-stack {
  display: flex;
  flex-direction: column;
  gap: var(--md-sys-space-50);
}
.gb-home-muted {
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-body-md);
  font-variation-settings: var(--md-sys-typescale-body-md-axes);
}
.gb-home-label {
  font: var(--md-sys-typescale-body-md);
  cursor: pointer;
}
.gb-home-media {
  display: flex;
  align-items: center;
  gap: var(--md-sys-space-200);
}
.gb-home-art-small {
  position: relative;
  display: grid;
  place-items: center;
  flex: none;
  inline-size: 72px;
  aspect-ratio: 1;
  color: var(--gb-tone);
}
.gb-home-art-small .gb-shape {
  position: absolute;
  inset: 0;
}
.gb-home-art-small md-gb-icon {
  position: relative;
  color: var(--gb-on-tone);
}
.gb-home-goal {
  display: flex;
  flex-direction: column;
  gap: var(--md-sys-space-100);
  padding: var(--md-sys-space-200);
  border-radius: var(--md-sys-shape-corner-lg);
  background: var(--md-sys-color-surface-container);
}
.gb-home-overline {
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-label-md);
  font-variation-settings: var(--md-sys-typescale-label-md-axes);
  text-transform: uppercase;
  letter-spacing: 0.08em;
}
.gb-home-figure {
  font: var(--md-sys-typescale-headline-lg);
  font-variation-settings: var(--md-sys-typescale-headline-lg-axes);
}

/* src/gb/morph.css */
@supports (d: path("M0 0")) {
  .gb-shape[data-morph] path {
    d: var(--gb-morph-from);
  }
  @media (prefers-reduced-motion: no-preference) {
    .gb-shape[data-morph]:not([data-morph-mode=loop]) path {
      transition: d var(--md-sys-motion-spring-default-spatial-duration) var(--md-sys-motion-spring-default-spatial);
    }
    :is(.gb-card:hover, .gb-card:focus-within, .gb-home-card:hover, .gb-home-card:focus-within, md-gb-carousel-item:hover, md-gb-carousel-item:focus-within) .gb-shape[data-morph]:not([data-morph-mode=loop]) path {
      d: var(--gb-morph-to);
    }
    .gb-shape[data-morph-mode=loop] path {
      animation: gb-morph-loop 8s infinite;
    }
    .gb-shape[data-morph-mode=loop]:is([data-delay="1"]) path {
      animation-delay: -2s;
    }
    .gb-shape[data-morph-mode=loop]:is([data-delay="2"]) path {
      animation-delay: -4s;
    }
    .gb-shape[data-morph-mode=loop]:is([data-delay="3"]) path {
      animation-delay: -6s;
    }
  }
}
@keyframes gb-morph-loop {
  0% {
    d: var(--gb-morph-from);
    animation-timing-function: linear;
  }
  35% {
    d: var(--gb-morph-from);
    animation-timing-function: var(--md-sys-motion-spring-slow-spatial);
  }
  50% {
    d: var(--gb-morph-to);
    animation-timing-function: linear;
  }
  85% {
    d: var(--gb-morph-to);
    animation-timing-function: var(--md-sys-motion-spring-slow-spatial);
  }
  100% {
    d: var(--gb-morph-from);
  }
}
@media (prefers-reduced-motion: no-preference) {
  .gb-hero-shape .gb-shape {
    animation: gb-shape-turn 60s linear infinite;
  }
  .gb-hero-shape:is([data-pos=b], [data-pos=d]) .gb-shape {
    animation-direction: reverse;
    animation-duration: 45s;
  }
}
@keyframes gb-shape-turn {
  to {
    rotate: 1turn;
  }
}

/* src/gb/reduce-motion.css */
:root[data-motion=reduce],
:root.gb-boot {
  --md-sys-motion-duration-short1: 1ms;
  --md-sys-motion-duration-short2: 1ms;
  --md-sys-motion-duration-short3: 1ms;
  --md-sys-motion-duration-short4: 1ms;
  --md-sys-motion-duration-medium1: 1ms;
  --md-sys-motion-duration-medium2: 1ms;
  --md-sys-motion-duration-medium3: 1ms;
  --md-sys-motion-duration-medium4: 1ms;
  --md-sys-motion-duration-long1: 1ms;
  --md-sys-motion-duration-long2: 1ms;
  --md-sys-motion-duration-long3: 1ms;
  --md-sys-motion-duration-long4: 1ms;
  --md-sys-motion-duration-extra-long1: 1ms;
  --md-sys-motion-duration-extra-long2: 1ms;
  --md-sys-motion-duration-extra-long3: 1ms;
  --md-sys-motion-duration-extra-long4: 1ms;
  --md-sys-motion-spring-fast-spatial-duration: 1ms;
  --md-sys-motion-spring-default-spatial-duration: 1ms;
  --md-sys-motion-spring-slow-spatial-duration: 1ms;
  --md-sys-motion-spring-fast-effects-duration: 1ms;
  --md-sys-motion-spring-default-effects-duration: 1ms;
  --md-sys-motion-spring-slow-effects-duration: 1ms;
  --md-sys-motion-curve-fast-spatial-duration: 1ms;
  --md-sys-motion-curve-default-spatial-duration: 1ms;
  --md-sys-motion-curve-slow-spatial-duration: 1ms;
  --md-sys-motion-curve-fast-effects-duration: 1ms;
  --md-sys-motion-curve-default-effects-duration: 1ms;
  --md-sys-motion-curve-slow-effects-duration: 1ms;
}
:root[data-motion=reduce] {
  scroll-behavior: auto;
}
:root[data-motion=reduce] *,
:root[data-motion=reduce] *::before,
:root[data-motion=reduce] *::after {
  animation-duration: 1ms !important;
  animation-delay: 0s !important;
  animation-iteration-count: 1 !important;
  transition-duration: 1ms !important;
  transition-delay: 0s !important;
  scroll-behavior: auto !important;
}

/* src/gb/compat.css */
.gb-visually-hidden {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.gb-compat {
  display: flex;
  flex-direction: column;
  gap: var(--md-sys-space-100);
  margin-block: var(--md-sys-space-200) var(--md-sys-space-400);
}
.gb-compat-row {
  border-radius: var(--md-sys-shape-corner-lg);
  background: var(--md-sys-color-surface-container-low);
}
.gb-compat-row[open] {
  background: var(--md-sys-color-surface-container);
}
.gb-compat-row[data-state=ok] {
  --gb-compat-shape: var(--md-sys-color-secondary-container);
  --gb-compat-on-shape: var(--md-sys-color-on-secondary-container);
  --gb-compat-badge: var(--md-sys-color-primary-container);
  --gb-compat-on-badge: var(--md-sys-color-on-primary-container);
}
.gb-compat-row[data-state=warn] {
  --gb-compat-shape: var(--md-sys-color-error-container);
  --gb-compat-on-shape: var(--md-sys-color-on-error-container);
  --gb-compat-badge: var(--md-sys-color-error-container);
  --gb-compat-on-badge: var(--md-sys-color-on-error-container);
}
.gb-compat-row:is([data-state=none], [data-state=info]) {
  --gb-compat-shape: var(--md-sys-color-surface-container-highest);
  --gb-compat-on-shape: var(--md-sys-color-on-surface-variant);
  --gb-compat-badge: var(--md-sys-color-surface-container-highest);
  --gb-compat-on-badge: var(--md-sys-color-on-surface-variant);
}
.gb-compat-logo {
  position: relative;
  display: grid;
  place-items: center;
  flex: none;
  inline-size: 44px;
  block-size: 44px;
  color: var(--gb-compat-on-shape);
}
.gb-compat-shape {
  position: absolute;
  inset: 0;
  inline-size: 100%;
  block-size: 100%;
  fill: var(--gb-compat-shape);
}
.gb-compat-logo-svg {
  position: relative;
  inline-size: 24px;
  block-size: 24px;
}
.gb-compat-logo[data-logo=baseline] .gb-compat-logo-svg {
  inline-size: 28px;
  block-size: 16px;
}
@media (prefers-reduced-motion: no-preference) {
  .gb-compat-shape {
    transition: rotate var(--md-sys-motion-spring-default-spatial-duration) var(--md-sys-motion-spring-default-spatial);
  }
  .gb-compat-summary:hover .gb-compat-shape {
    rotate: 30deg;
  }
  .gb-compat-row[open] .gb-compat-shape {
    rotate: 60deg;
  }
}
.gb-compat-summary {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--md-sys-space-150);
  min-block-size: 56px;
  padding: var(--md-sys-space-100) var(--md-sys-space-200);
  border-radius: inherit;
  list-style: none;
  cursor: pointer;
  isolation: isolate;
}
.gb-compat-summary::-webkit-details-marker {
  display: none;
}
.gb-compat-summary::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: var(--md-sys-color-on-surface);
  opacity: 0;
}
.gb-compat-summary:hover::before {
  opacity: 0.08;
}
.gb-compat-summary:active::before {
  opacity: 0.1;
}
.gb-compat-summary:focus-visible {
  outline: 3px solid var(--md-sys-color-secondary);
  outline-offset: 2px;
}
.gb-compat-main {
  display: flex;
  flex: 1 1 auto;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--md-sys-space-100) var(--md-sys-space-150);
  min-inline-size: 0;
}
.gb-compat-name {
  font: var(--md-sys-typescale-title-md);
  font-variation-settings: var(--md-sys-typescale-title-md-axes);
}
.gb-compat-badge {
  padding: 2px var(--md-sys-space-100);
  border-radius: var(--md-sys-shape-corner-sm);
  background: var(--gb-compat-badge);
  color: var(--gb-compat-on-badge);
  font: var(--md-sys-typescale-label-md);
  font-variation-settings: var(--md-sys-typescale-label-md-axes);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.gb-compat-extra {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--md-sys-space-50);
  margin-inline-start: auto;
}
.gb-compat-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--md-sys-space-50);
  min-block-size: 28px;
  padding-inline: var(--md-sys-space-150);
  border-radius: var(--md-sys-shape-corner-full);
  background: var(--md-sys-color-surface-container-highest);
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-label-md);
  font-variation-settings: var(--md-sys-typescale-label-md-axes);
}
.gb-compat-chip md-gb-icon {
  --md-icon-size: 16px;
  color: var(--md-sys-color-primary);
}
.gb-compat-chevron {
  flex: none;
  color: var(--md-sys-color-on-surface-variant);
}
@media (prefers-reduced-motion: no-preference) {
  .gb-compat-chevron {
    transition: rotate var(--md-sys-motion-spring-fast-spatial-duration) var(--md-sys-motion-spring-fast-spatial);
  }
}
.gb-compat-row[open] .gb-compat-chevron {
  rotate: 180deg;
}
.gb-compat-body {
  padding: 0 var(--md-sys-space-200) var(--md-sys-space-200) calc(var(--md-sys-space-200) + 44px + var(--md-sys-space-150));
  color: var(--md-sys-color-on-surface);
}
.gb-compat-body p {
  margin: var(--md-sys-space-100) 0;
}
.gb-compat-list {
  margin: var(--md-sys-space-100) 0;
  padding-inline-start: var(--md-sys-space-250, 20px);
}
.gb-compat-list li {
  margin-block: var(--md-sys-space-50);
}
.gb-compat-tag {
  display: inline-block;
  padding: 0 var(--md-sys-space-75, 6px);
  border-radius: var(--md-sys-shape-corner-xs);
  font: var(--md-sys-typescale-label-sm);
  font-variation-settings: var(--md-sys-typescale-label-sm-axes);
  vertical-align: 1px;
}
.gb-compat-tag[data-status=newly] {
  background: var(--md-sys-color-tertiary-container);
  color: var(--md-sys-color-on-tertiary-container);
}
.gb-compat-tag[data-status=limited] {
  background: var(--md-sys-color-surface-container-highest);
  color: var(--md-sys-color-on-surface-variant);
}
.gb-compat-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: var(--md-sys-space-100) var(--md-sys-space-300);
  font: var(--md-sys-typescale-body-md);
}
.gb-compat-note {
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-body-sm);
  font-variation-settings: var(--md-sys-typescale-body-sm-axes);
}
.gb-compat-scores {
  display: flex;
  flex-wrap: wrap;
  gap: var(--md-sys-space-300);
  margin: var(--md-sys-space-200) 0;
  padding: 0;
  list-style: none;
}
.gb-compat-score {
  display: grid;
  justify-items: center;
  gap: var(--md-sys-space-100);
}
.gb-compat-score md-gb-progress {
  grid-area: 1 / 1;
  --size: 64px;
}
.gb-compat-score-value {
  grid-area: 1 / 1;
  align-self: center;
  font: var(--md-sys-typescale-title-md);
  font-variation-settings: var(--md-sys-typescale-title-md-axes);
}
.gb-compat-score-label {
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-label-md);
  font-variation-settings: var(--md-sys-typescale-label-md-axes);
}
.gb-compat-score[data-level=good] md-gb-progress {
  --active-indicator-color: var(--md-sys-color-primary);
}
.gb-compat-score[data-level=fair] md-gb-progress {
  --active-indicator-color: var(--md-sys-color-tertiary);
}
.gb-compat-score[data-level=poor] md-gb-progress {
  --active-indicator-color: var(--md-sys-color-error);
}

/* src/gb/gb.css */
@font-face {
  font-family: "Roboto Flex Fallback";
  src:
    local("Arial"),
    local("Helvetica"),
    local("Liberation Sans");
  size-adjust: 99%;
  ascent-override: 92.8%;
  descent-override: 24.4%;
  line-gap-override: 0%;
}
:root {
  --md-ref-typeface-plain:
    "Roboto Flex",
    "Roboto Flex Fallback",
    Roboto,
    "Noto Sans",
    system-ui,
    sans-serif;
  --gb-toc-width: 240px;
  --md-icon-font: "Material Symbols Outlined";
}
*,
*::before,
*::after {
  box-sizing: border-box;
}
@supports not selector(::-webkit-scrollbar) {
  :root {
    scrollbar-width: thin;
    scrollbar-color: var(--md-sys-color-outline) transparent;
  }
}
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-button {
  display: none;
}
::-webkit-scrollbar-track,
::-webkit-scrollbar-corner {
  background: transparent;
}
::-webkit-scrollbar-track {
  margin: var(--scrollbar-track-inset, 4px);
}
::-webkit-scrollbar-thumb {
  min-height: 40px;
  border: 2px solid transparent;
  border-radius: var(--md-sys-shape-corner-full);
  background: var(--md-sys-color-outline) padding-box;
}
:hover::-webkit-scrollbar-thumb {
  background-color: var(--md-sys-color-on-surface-variant);
}
.gb-content-pane,
.gb-outline-body,
.gb-search-body {
  scrollbar-gutter: stable;
}
.gb-content-pane::-webkit-scrollbar,
.gb-outline-body::-webkit-scrollbar {
  width: 14px;
}
.gb-content-pane::-webkit-scrollbar-thumb,
.gb-outline-body::-webkit-scrollbar-thumb {
  border-width: 4px;
}
.gb-content-pane::-webkit-scrollbar-track {
  margin-block: var(--md-sys-space-300);
}
html {
  scroll-padding-block-start: 16px;
  -webkit-text-size-adjust: 100%;
}
body {
  margin: 0;
  background: var(--md-sys-color-surface);
  color: var(--md-sys-color-on-surface);
  font: var(--md-sys-typescale-body-lg);
  font-variation-settings: var(--md-sys-typescale-body-lg-axes);
  min-block-size: 100dvh;
}
.gb-skip {
  position: absolute;
  inset-block-start: 8px;
  inset-inline-start: 8px;
  z-index: 100;
  padding: var(--md-sys-space-150) var(--md-sys-space-300);
  border-radius: var(--md-sys-shape-corner-full);
  background: var(--md-sys-color-primary);
  color: var(--md-sys-color-on-primary);
  font: var(--md-sys-typescale-label-lg);
  text-decoration: none;
  translate: 0 -200%;
}
.gb-skip:focus-visible {
  translate: 0 0;
  outline: 3px solid var(--md-sys-color-tertiary);
  outline-offset: 2px;
}
.gb-main {
  min-inline-size: 0;
  padding: var(--md-sys-space-300) var(--md-sys-space-200) var(--md-sys-space-800);
  max-inline-size: 60rem;
  margin-inline: auto;
  inline-size: 100%;
}
.gb-main:focus {
  outline: none;
}
.gb-main > h1 {
  font: var(--md-sys-typescale-display-sm);
  font-variation-settings: var(--md-sys-typescale-display-sm-axes);
  margin: 0 0 var(--md-sys-space-100);
}
.gb-lede {
  margin: 0 0 var(--md-sys-space-300);
  color: var(--md-sys-color-on-surface-variant);
}
.gb-md-link {
  margin: calc(-1 * var(--md-sys-space-150)) 0 var(--md-sys-space-300);
}
.gb-md-link a {
  display: inline-flex;
  align-items: center;
  box-sizing: border-box;
  min-block-size: 32px;
  padding-inline: var(--md-sys-space-150);
  margin-inline-start: calc(-1 * var(--md-sys-space-150));
  border-radius: var(--md-sys-shape-corner-full, 999px);
  color: var(--md-sys-color-primary);
  font: var(--md-sys-typescale-label-lg);
  font-variation-settings: var(--md-sys-typescale-label-lg-axes);
  text-decoration: none;
  transition: background-color 150ms;
}
.gb-md-link a:hover {
  background: color-mix(in srgb, var(--md-sys-color-primary) 8%, transparent);
}
.gb-md-link a:focus-visible {
  outline: 3px solid var(--md-sys-color-secondary);
  outline-offset: 1px;
}
.gb-content h2,
.gb-content h3,
.gb-content h4 {
  margin-block: var(--md-sys-space-400) var(--md-sys-space-150);
}
.gb-content h2 {
  font: var(--md-sys-typescale-headline-md);
  font-variation-settings: var(--md-sys-typescale-headline-md-axes);
}
.gb-content h3 {
  font: var(--md-sys-typescale-title-lg);
  font-variation-settings: var(--md-sys-typescale-title-lg-axes);
}
.gb-content h4 {
  font: var(--md-sys-typescale-title-md);
  font-variation-settings: var(--md-sys-typescale-title-md-axes);
}
.gb-content .heading {
  display: flex;
  align-items: baseline;
  gap: var(--md-sys-space-100);
}
.gb-content .heading > :is(h2, h3, h4) {
  margin: 0;
}
.gb-content .heading {
  margin-block: var(--md-sys-space-400) var(--md-sys-space-150);
}
.gb-content .heading > .anchor {
  color: var(--md-sys-color-on-surface-variant);
  text-decoration: none;
  opacity: 0;
}
.gb-content .heading:hover > .anchor,
.gb-content .heading > .anchor:focus-visible {
  opacity: 1;
}
.gb-content .heading > .anchor:focus-visible {
  outline: 2px solid var(--md-sys-color-primary);
  border-radius: var(--md-sys-shape-corner-xs);
}
.offscreen {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
.gb-content p,
.gb-content ul,
.gb-content ol {
  margin-block: 0 var(--md-sys-space-200);
}
.gb-content a {
  color: var(--md-sys-color-primary);
}
.gb-content :not(pre) > code {
  font-family:
    ui-monospace,
    "Roboto Mono",
    Menlo,
    Consolas,
    monospace;
  font-size: 0.9em;
  padding: 0.1em 0.4em;
  border-radius: var(--md-sys-shape-corner-xs);
  background: var(--md-sys-color-surface-container-highest);
}
.gb-table {
  overflow-x: auto;
  margin-block-end: var(--md-sys-space-200);
}
.gb-table:focus-visible {
  outline: 2px solid var(--md-sys-color-primary);
}
.gb-content table {
  border-collapse: collapse;
  inline-size: 100%;
  font: var(--md-sys-typescale-body-md);
}
.gb-content th,
.gb-content td {
  text-align: start;
  vertical-align: top;
  padding: var(--md-sys-space-150) var(--md-sys-space-150);
  border-block-end: 1px solid var(--md-sys-color-outline-variant);
}
.gb-content th {
  font: var(--md-sys-typescale-label-lg);
  font-variation-settings: var(--md-sys-typescale-label-lg-axes);
  color: var(--md-sys-color-on-surface-variant);
  white-space: nowrap;
}
.gb-content td {
  font: var(--md-sys-typescale-body-md);
  font-variation-settings: var(--md-sys-typescale-body-md-axes);
}
.gb-content tbody tr:last-child td {
  border-block-end: 0;
}
.gb-content td code {
  font-size: var(--md-sys-typescale-body-sm-size, 0.8125rem);
  background: none;
  padding: 0;
  overflow-wrap: break-word;
}
.gb-content td:first-child code {
  color: var(--md-sys-color-on-surface);
  font-weight: 500;
}
.gb-desc {
  display: block;
  margin-block-start: var(--md-sys-space-50);
  color: var(--md-sys-color-on-surface-variant);
  font: var(--md-sys-typescale-body-sm);
  font-variation-settings: var(--md-sys-typescale-body-sm-axes);
  min-inline-size: 16em;
}
.gb-desc code {
  font-size: inherit;
}
.gb-content img,
.gb-content video {
  max-inline-size: 100%;
  block-size: auto;
}
.gb-code {
  position: relative;
  margin-block: 0 var(--md-sys-space-200);
}
.gb-content pre {
  margin: 0;
  padding: var(--md-sys-space-200);
  padding-inline-end: 56px;
  overflow-x: auto;
  border-radius: var(--md-sys-shape-corner-md);
  background: var(--md-sys-color-surface-container);
  color: var(--md-sys-color-on-surface);
  font: var(--md-sys-typescale-body-md);
  font-family:
    ui-monospace,
    "Roboto Mono",
    Menlo,
    Consolas,
    monospace;
  tab-size: 2;
}
.gb-content pre:focus-visible {
  outline: 2px solid var(--md-sys-color-primary);
}
.gb-copy {
  position: absolute;
  inset-block-start: var(--md-sys-space-50);
  inset-inline-end: var(--md-sys-space-50);
  border-radius: var(--md-sys-shape-corner-full);
  background: var(--md-sys-color-surface-container);
}
.token.comment,
.token.prolog,
.token.doctype {
  color: var(--md-sys-color-on-surface-variant);
}
.token.tag,
.token.keyword,
.token.number,
.token.boolean,
.token.selector {
  color: var(--md-sys-color-primary);
}
.token.string,
.token.attr-value,
.token.function {
  color: var(--md-sys-color-secondary);
}
.token.attr-name,
.token.property,
.token.class-name {
  color: var(--md-sys-color-tertiary);
}
.gb-all-title {
  margin: 0 0 var(--md-sys-space-100);
  font: var(--md-sys-typescale-display-md);
  font-variation-settings: var(--md-sys-typescale-display-md-axes);
}
.gb-all-contents ul {
  margin: 0;
  padding-inline-start: 1.25rem;
}
.gb-all-contents > ul {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
  gap: var(--md-sys-space-200);
  padding: 0;
  list-style: none;
}
.gb-all-contents > ul > li > span {
  font: var(--md-sys-typescale-title-md);
  font-variation-settings: var(--md-sys-typescale-title-md-axes);
}
.gb-all-contents a {
  color: var(--md-sys-color-primary);
}
.gb-all-page {
  margin-block-start: var(--md-sys-space-800);
  padding-block-start: var(--md-sys-space-300);
  border-block-start: 1px solid var(--md-sys-color-outline-variant);
}
.gb-all-page > h1 {
  font: var(--md-sys-typescale-display-sm);
  font-variation-settings: var(--md-sys-typescale-display-sm-axes);
  margin: 0 0 var(--md-sys-space-100);
}
.gb-all-source {
  margin: 0 0 var(--md-sys-space-300);
  font: var(--md-sys-typescale-body-sm);
  color: var(--md-sys-color-on-surface-variant);
  overflow-wrap: anywhere;
}
.gb-all-source a {
  color: inherit;
}
@media print {
  .gb-all-page {
    break-before: page;
    border: 0;
    margin-block-start: 0;
  }
  .gb-all-page > h1 {
    break-after: avoid;
  }
  .gb-content pre,
  .gb-demo {
    break-inside: avoid;
  }
  .gb-rail-area,
  .gb-bar,
  .gb-top,
  .gb-toc,
  .gb-copy,
  .gb-skip,
  .gb-demo-toggle {
    display: none;
  }
  :root.js .gb-demo .gb-code {
    block-size: auto !important;
    mask-image: none !important;
  }
}
:root {
  interpolate-size: allow-keywords;
}
.gb-demo {
  margin: 0 0 var(--md-sys-space-200);
  border: 1px solid var(--md-sys-color-outline-variant);
  border-radius: var(--md-sys-shape-corner-lg);
  overflow: clip;
}
.gb-demo-preview,
.gb-content figure.gb-demo-figure {
  box-sizing: border-box;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--md-sys-space-200);
  min-block-size: 12rem;
  margin: 0;
  padding: var(--md-sys-space-400);
  background: var(--md-sys-color-surface-container-lowest);
  color: var(--md-sys-color-on-surface);
}
.gb-content figure.gb-demo-figure {
  margin-block-end: var(--md-sys-space-200);
  border: 1px solid var(--md-sys-color-outline-variant);
  border-radius: var(--md-sys-shape-corner-lg);
}
.gb-demo-preview > .gb-example {
  inline-size: 100%;
}
.gb-demo-inline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: var(--md-sys-space-200);
  inline-size: 100%;
}
.gb-demo-preview:has(> .gb-demo-inline) {
  min-block-size: var(--gb-demo-height, 12rem);
}
.gb-demo-inline > md-gb-carousel {
  inline-size: 100%;
}
md-gb-carousel:not(:defined) {
  display: block;
  block-size: var(--height, 221px);
  visibility: hidden;
}
md-gb-time-picker:not(:defined):not([modal]) {
  display: block;
  inline-size: 304px;
  block-size: 520px;
  visibility: hidden;
}
md-gb-time-picker:not(:defined)[density="-1"]:not([modal]) {
  inline-size: 300px;
  block-size: 512px;
}
md-gb-time-picker:not(:defined)[density="-2"]:not([modal]) {
  inline-size: 300px;
  block-size: 504px;
}
md-gb-time-picker:not(:defined)[density="-3"]:not([modal]) {
  inline-size: 300px;
  block-size: 496px;
}
md-gb-time-picker:not(:defined)[orientation=horizontal]:not([modal]) {
  inline-size: 556px;
  block-size: 404px;
}
md-gb-time-picker:not(:defined)[mode=input]:not([modal]) {
  inline-size: 264px;
  block-size: 243px;
}
md-gb-time-picker:not(:defined)[mode=input][density="-1"]:not([modal]) {
  block-size: 239px;
}
md-gb-time-picker:not(:defined)[mode=input][density="-2"]:not([modal]) {
  block-size: 235px;
}
md-gb-time-picker:not(:defined)[mode=input][density="-3"]:not([modal]) {
  block-size: 231px;
}
.gb-demo-preview[data-frame] {
  display: block;
  padding: 0;
  min-block-size: var(--gb-demo-height, 12rem);
}
.gb-demo-frame {
  display: block;
  inline-size: 100%;
  block-size: var(--gb-demo-height, 12rem);
  border: 0;
}
.gb-demo-tabs {
  min-block-size: 48px;
}
.gb-demo-tabs:not(:defined) {
  display: block;
  block-size: 48px;
  visibility: hidden;
}
.gb-demo-code {
  position: relative;
  border-block-start: 1px solid var(--md-sys-color-outline-variant);
  background: var(--md-sys-color-surface-container);
}
.gb-demo .gb-code {
  margin: 0;
  font: var(--md-sys-typescale-body-md);
  font-family:
    ui-monospace,
    "Roboto Mono",
    Menlo,
    Consolas,
    monospace;
}
.gb-demo pre {
  border-radius: 0;
  background: transparent;
  font: inherit;
}
:root.js .gb-demo:not([data-short]):not([data-open]) .gb-code {
  block-size: calc(3lh + 2 * var(--md-sys-space-200));
  overflow: hidden;
  mask-image:
    linear-gradient(
      to bottom,
      #000 35%,
      transparent);
}
:root.js .gb-demo:not([data-short])[data-open] .gb-code {
  block-size: auto;
}
:root.js .gb-demo:not([data-short]) .gb-code {
  transition: block-size var(--md-sys-motion-duration-medium2) var(--md-sys-motion-easing-emphasized);
}
.gb-demo-toggle {
  position: absolute;
  inset-inline: 0;
  inset-block-end: var(--md-sys-space-150);
  margin-inline: auto;
  inline-size: fit-content;
}
.gb-demo[data-open] .gb-demo-toggle {
  position: static;
  display: block;
  margin-block: 0 var(--md-sys-space-150);
}
.gb-demo-toggle:not(:defined) {
  visibility: hidden;
}
@media (prefers-reduced-motion: reduce) {
  :root.js .gb-demo:not([data-short]) .gb-code {
    transition: none;
  }
}
.gb-example {
  min-block-size: var(--gb-example-narrow-height, 0);
}
@media (min-width: 600px) {
  .gb-example {
    min-block-size: var(--gb-example-height, 0);
  }
}
.gb-content figure :not(:defined) {
  visibility: hidden;
}
@keyframes gb-skeleton-pulse {
  from {
    background-position: 100% 100%;
  }
  to {
    background-position: 0 0;
  }
}
.gb-demo-preview,
.gb-content figure.gb-demo-figure {
  position: relative;
}
.gb-demo-preview::after,
.gb-content figure.gb-demo-figure::after,
.gb-card-stage::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  background-color: var(--md-sys-color-surface-container);
  background-image:
    linear-gradient(
      135deg,
      transparent 40%,
      hsl(from var(--md-sys-color-on-surface) h s l / 6%) 50%,
      transparent 60%);
  background-size: 300% 300%;
  opacity: 0;
  transition: opacity var(--md-sys-motion-duration-short3, 150ms) linear;
}
:is(.gb-demo-preview, .gb-content figure.gb-demo-figure, .gb-card-stage):is(:has(:not(:defined)), :has(> .gb-demo-frame:not([data-ready])))::after {
  opacity: 1;
  animation: gb-skeleton-pulse 1.5s linear infinite;
}
@media (prefers-reduced-motion: reduce) {
  :is(.gb-demo-preview, .gb-content figure.gb-demo-figure, .gb-card-stage)::after {
    animation: none !important;
  }
}
/*!
 * Copyright 2026 Google LLC
 * SPDX-License-Identifier: Apache-2.0
 */
/*!
* Copyright 2026 Google LLC
* SPDX-License-Identifier: Apache-2.0
*/
/**
 * @license
 * Copyright 2026 Google LLC
 * SPDX-License-Identifier: Apache-2.0
 */
/*# sourceMappingURL=gb.css.map */