/* :root {
    --accent: 136, 58, 234;
    --accent-light: 224, 204, 250;
    --accent-dark: 49, 10, 101;
    --accent-gradient: linear-gradient(
      45deg,
      rgb(var(--accent)),
      rgb(var(--accent-light)) 30%,
      white 60%
    );
  }
  html {
    font-family: system-ui, sans-serif;
    background: #13151a;
    background-size: 224px;
  }
  code {
    font-family:
      Menlo,
      Monaco,
      Lucida Console,
      Liberation Mono,
      DejaVu Sans Mono,
      Bitstream Vera Sans Mono,
      Courier New,
      monospace;
  } */
      html:not([data-mode]) {
  --md-sys-color-primary: 0 100 149;
  --md-sys-color-on-primary: 255 255 255;
  --md-sys-color-primary-container: 203 230 255;
  --md-sys-color-on-primary-container: 0 30 48;
  --md-sys-color-primary-fixed: 203 230 255;
  --md-sys-color-on-primary-fixed: 0 30 48;
  --md-sys-color-primary-fixed-dim: 143 205 255;
  --md-sys-color-on-primary-fixed-variant: 0 75 113;
  --md-sys-color-secondary: 80 96 111;
  --md-sys-color-on-secondary: 255 255 255;
  --md-sys-color-secondary-container: 212 228 246;
  --md-sys-color-on-secondary-container: 13 29 41;
  --md-sys-color-secondary-fixed: 212 228 246;
  --md-sys-color-on-secondary-fixed: 13 29 41;
  --md-sys-color-secondary-fixed-dim: 184 200 217;
  --md-sys-color-on-secondary-fixed-variant: 57 72 86;
  --md-sys-color-tertiary: 102 88 123;
  --md-sys-color-on-tertiary: 255 255 255;
  --md-sys-color-tertiary-container: 236 220 255;
  --md-sys-color-on-tertiary-container: 33 22 52;
  --md-sys-color-tertiary-fixed: 236 220 255;
  --md-sys-color-on-tertiary-fixed: 33 22 52;
  --md-sys-color-tertiary-fixed-dim: 208 191 232;
  --md-sys-color-on-tertiary-fixed-variant: 77 65 98;
  --md-sys-color-error: 186 26 26;
  --md-sys-color-error-container: 255 218 214;
  --md-sys-color-on-error: 255 255 255;
  --md-sys-color-on-error-container: 65 0 2;
  --md-sys-color-background: 252 252 255;
  --md-sys-color-on-background: 26 28 30;
  --md-sys-color-outline: 114 120 126;
  --md-sys-color-inverse-on-surface: 240 240 243;
  --md-sys-color-inverse-surface: 46 49 51;
  --md-sys-color-inverse-primary: 143 205 255;
  --md-sys-color-shadow: 0 0 0;
  --md-sys-color-surface-tint: 0 100 149;
  --md-sys-color-outline-variant: 193 199 206;
  --md-sys-color-scrim: 0 0 0;
  --md-sys-color-surface: 249 249 252;
  --md-sys-color-on-surface: 26 28 30;
  --md-sys-color-surface-variant: 222 227 234;
  --md-sys-color-on-surface-variant: 65 71 77;
  --md-sys-color-surface-container-highest: 226 226 229;
  --md-sys-color-surface-container-high: 232 232 235;
  --md-sys-color-surface-container: 237 238 241;
  --md-sys-color-surface-container-low: 243 243 246;
  --md-sys-color-surface-container-lowest: 255 255 255;
  --md-sys-color-surface-dim: 217 218 221;
  --md-sys-color-surface-bright: 249 249 252;
}
      html[data-mode="dark"] {
  --md-sys-color-primary: 143 205 255;
  --md-sys-color-on-primary: 0 52 80;
  --md-sys-color-primary-container: 0 75 113;
  --md-sys-color-on-primary-container: 203 230 255;
  --md-sys-color-primary-fixed: 203 230 255;
  --md-sys-color-on-primary-fixed: 0 30 48;
  --md-sys-color-primary-fixed-dim: 143 205 255;
  --md-sys-color-on-primary-fixed-variant: 0 75 113;
  --md-sys-color-secondary: 184 200 217;
  --md-sys-color-on-secondary: 34 50 63;
  --md-sys-color-secondary-container: 57 72 86;
  --md-sys-color-on-secondary-container: 212 228 246;
  --md-sys-color-secondary-fixed: 212 228 246;
  --md-sys-color-on-secondary-fixed: 13 29 41;
  --md-sys-color-secondary-fixed-dim: 184 200 217;
  --md-sys-color-on-secondary-fixed-variant: 57 72 86;
  --md-sys-color-tertiary: 208 191 232;
  --md-sys-color-on-tertiary: 54 43 74;
  --md-sys-color-tertiary-container: 77 65 98;
  --md-sys-color-on-tertiary-container: 236 220 255;
  --md-sys-color-tertiary-fixed: 236 220 255;
  --md-sys-color-on-tertiary-fixed: 33 22 52;
  --md-sys-color-tertiary-fixed-dim: 208 191 232;
  --md-sys-color-on-tertiary-fixed-variant: 77 65 98;
  --md-sys-color-error: 255 180 171;
  --md-sys-color-error-container: 147 0 10;
  --md-sys-color-on-error: 105 0 5;
  --md-sys-color-on-error-container: 255 218 214;
  --md-sys-color-background: 26 28 30;
  --md-sys-color-on-background: 226 226 229;
  --md-sys-color-outline: 139 145 152;
  --md-sys-color-inverse-on-surface: 26 28 30;
  --md-sys-color-inverse-surface: 226 226 229;
  --md-sys-color-inverse-primary: 0 100 149;
  --md-sys-color-shadow: 0 0 0;
  --md-sys-color-surface-tint: 143 205 255;
  --md-sys-color-outline-variant: 65 71 77;
  --md-sys-color-scrim: 0 0 0;
  --md-sys-color-surface: 17 20 22;
  --md-sys-color-on-surface: 198 198 201;
  --md-sys-color-surface-variant: 65 71 77;
  --md-sys-color-on-surface-variant: 193 199 206;
  --md-sys-color-surface-container-highest: 51 53 55;
  --md-sys-color-surface-container-high: 40 42 45;
  --md-sys-color-surface-container: 30 32 34;
  --md-sys-color-surface-container-low: 26 28 30;
  --md-sys-color-surface-container-lowest: 12 14 17;
  --md-sys-color-surface-dim: 17 20 22;
  --md-sys-color-surface-bright: 55 57 60;
}
      html {
  /* display - large */
  --md-sys-typescale-display-large-font-family-name: Roboto;
  --md-sys-typescale-display-large-font-family-style: Regular;
  --md-sys-typescale-display-large-font-weight: 400;
  --md-sys-typescale-display-large-font-size: 57px;
  --md-sys-typescale-display-large-line-height: 64px;
  --md-sys-typescale-display-large-letter-spacing: -0.25px;
  /* display - medium */
  --md-sys-typescale-display-medium-font-family-name: Roboto;
  --md-sys-typescale-display-medium-font-family-style: Regular;
  --md-sys-typescale-display-medium-font-weight: 400;
  --md-sys-typescale-display-medium-font-size: 45px;
  --md-sys-typescale-display-medium-line-height: 52px;
  --md-sys-typescale-display-medium-letter-spacing: 0px;
  /* display - small */
  --md-sys-typescale-display-small-font-family-name: Roboto;
  --md-sys-typescale-display-small-font-family-style: Regular;
  --md-sys-typescale-display-small-font-weight: 400;
  --md-sys-typescale-display-small-font-size: 36px;
  --md-sys-typescale-display-small-line-height: 44px;
  --md-sys-typescale-display-small-letter-spacing: 0px;
  /* headline - large */
  --md-sys-typescale-headline-large-font-family-name: Roboto;
  --md-sys-typescale-headline-large-font-family-style: Regular;
  --md-sys-typescale-headline-large-font-weight: 400;
  --md-sys-typescale-headline-large-font-size: 32px;
  --md-sys-typescale-headline-large-line-height: 40px;
  --md-sys-typescale-headline-large-letter-spacing: 0px;
  /* headline - medium */
  --md-sys-typescale-headline-medium-font-family-name: Roboto;
  --md-sys-typescale-headline-medium-font-family-style: Regular;
  --md-sys-typescale-headline-medium-font-weight: 400;
  --md-sys-typescale-headline-medium-font-size: 28px;
  --md-sys-typescale-headline-medium-line-height: 36px;
  --md-sys-typescale-headline-medium-letter-spacing: 0px;
  /* headline - small */
  --md-sys-typescale-headline-small-font-family-name: Roboto;
  --md-sys-typescale-headline-small-font-family-style: Regular;
  --md-sys-typescale-headline-small-font-weight: 400;
  --md-sys-typescale-headline-small-font-size: 24px;
  --md-sys-typescale-headline-small-line-height: 32px;
  --md-sys-typescale-headline-small-letter-spacing: 0px;
  /* body - large */
  --md-sys-typescale-body-large-font-family-name: Roboto;
  --md-sys-typescale-body-large-font-family-style: Regular;
  --md-sys-typescale-body-large-font-weight: 400;
  --md-sys-typescale-body-large-font-size: 16px;
  --md-sys-typescale-body-large-line-height: 24px;
  --md-sys-typescale-body-large-letter-spacing: 0.5px;
  /* body - medium */
  --md-sys-typescale-body-medium-font-family-name: Roboto;
  --md-sys-typescale-body-medium-font-family-style: Regular;
  --md-sys-typescale-body-medium-font-weight: 400;
  --md-sys-typescale-body-medium-font-size: 14px;
  --md-sys-typescale-body-medium-line-height: 20px;
  --md-sys-typescale-body-medium-letter-spacing: 0.25px;
  /* body - small */
  --md-sys-typescale-body-small-font-family-name: Roboto;
  --md-sys-typescale-body-small-font-family-style: Regular;
  --md-sys-typescale-body-small-font-weight: 400;
  --md-sys-typescale-body-small-font-size: 12px;
  --md-sys-typescale-body-small-line-height: 16px;
  --md-sys-typescale-body-small-letter-spacing: 0.4px;
  /* label - large */
  --md-sys-typescale-label-large-font-family-name: Roboto;
  --md-sys-typescale-label-large-font-family-style: Medium;
  --md-sys-typescale-label-large-font-weight: 500;
  --md-sys-typescale-label-large-font-size: 14px;
  --md-sys-typescale-label-large-line-height: 20px;
  --md-sys-typescale-label-large-letter-spacing: 0.1px;
  /* label - medium */
  --md-sys-typescale-label-medium-font-family-name: Roboto;
  --md-sys-typescale-label-medium-font-family-style: Medium;
  --md-sys-typescale-label-medium-font-weight: 500;
  --md-sys-typescale-label-medium-font-size: 12px;
  --md-sys-typescale-label-medium-line-height: 16px;
  --md-sys-typescale-label-medium-letter-spacing: 0.5px;
  /* label - small */
  --md-sys-typescale-label-small-font-family-name: Roboto;
  --md-sys-typescale-label-small-font-family-style: Medium;
  --md-sys-typescale-label-small-font-weight: 500;
  --md-sys-typescale-label-small-font-size: 11px;
  --md-sys-typescale-label-small-line-height: 16px;
  --md-sys-typescale-label-small-letter-spacing: 0.5px;
  /* title - large */
  --md-sys-typescale-title-large-font-family-name: Roboto;
  --md-sys-typescale-title-large-font-family-style: Regular;
  --md-sys-typescale-title-large-font-weight: 400;
  --md-sys-typescale-title-large-font-size: 22px;
  --md-sys-typescale-title-large-line-height: 28px;
  --md-sys-typescale-title-large-letter-spacing: 0px;
  /* title - medium */
  --md-sys-typescale-title-medium-font-family-name: Roboto;
  --md-sys-typescale-title-medium-font-family-style: Medium;
  --md-sys-typescale-title-medium-font-weight: 500;
  --md-sys-typescale-title-medium-font-size: 16px;
  --md-sys-typescale-title-medium-line-height: 24px;
  --md-sys-typescale-title-medium-letter-spacing: 0.15px;
  /* title - small */
  --md-sys-typescale-title-small-font-family-name: Roboto;
  --md-sys-typescale-title-small-font-family-style: Medium;
  --md-sys-typescale-title-small-font-weight: 500;
  --md-sys-typescale-title-small-font-size: 14px;
  --md-sys-typescale-title-small-line-height: 20px;
  --md-sys-typescale-title-small-letter-spacing: 0.1px;
}