html,
body {
  height: 100%;
}
/*
        This font software is the property of Commercial Type.

        You may not modify the font software, use it on another website, or install it on a computer.

        License information is available at http://commercialtype.com/eula
        For more information please visit Commercial Type at http://commercialtype.com or email us at info[at]commercialtype.com

        Copyright (C) 2023 Schwartzco Inc.
        License: 2307-YTXIXD
*/
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-SuperItalic-Web-45a725c393b1692115cee9f669e5f18b.woff2?vsn=d") format("woff2");
  font-weight: 900;
  font-style: italic;
  font-stretch: normal;
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-Super-Web-d14232972de6b575346bede1e648068b.woff2?vsn=d") format("woff2");
  font-weight: 900;
  font-style: normal;
  font-stretch: normal;
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-BlackItalic-Web-860f3b27cfb3e7295bfc73cd23f6d128.woff2?vsn=d") format("woff2");
  font-weight: 800;
  font-style: italic;
  font-stretch: normal;
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-Black-Web-ee19f04445e990c05e98a65d442a2be2.woff2?vsn=d") format("woff2");
  font-weight: 800;
  font-style: normal;
  font-stretch: normal;
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-BoldItalic-Web-13bfe74bf63902ebfccf9e9b2a3b1d29.woff2?vsn=d") format("woff2");
  font-weight: 700;
  font-style: italic;
  font-stretch: normal;
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-Bold-Web-911f4d49b45afdac13efe55639f1806f.woff2?vsn=d") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-stretch: normal;
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-SemiboldItalic-Web-86c79855b8a1b06df0e3710a72bd73a1.woff2?vsn=d") format("woff2");
  font-weight: 600;
  font-style: italic;
  font-stretch: normal;
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-Semibold-Web-6d2e1a8ebeaac1437a401b17fc05aed7.woff2?vsn=d") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-stretch: normal;
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-MediumItalic-Web-eba607ee79647a4c834bf302604de801.woff2?vsn=d") format("woff2");
  font-weight: 500;
  font-style: italic;
  font-stretch: normal;
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-Medium-Web-032602038b4c7358c598238e02d883af.woff2?vsn=d") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-stretch: normal;
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-RegularItalic-Web-a718c633b82df831828a87636159ff75.woff2?vsn=d") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-stretch: normal;
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-Regular-Web-5c7d851b3cb62d3e74a2d777e910f8bf.woff2?vsn=d") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-stretch: normal;
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-LightItalic-Web-abc2852a8d8edfc111e7043b42a0f4f6.woff2?vsn=d") format("woff2");
  font-weight: 300;
  font-style: italic;
  font-stretch: normal;
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-Light-Web-d034695e473a77bbb50e6c91e47b5f8d.woff2?vsn=d") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-stretch: normal;
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-ExtralightItalic-Web-db157e933735556e62960ae8ec53f561.woff2?vsn=d") format("woff2");
  font-weight: 200;
  font-style: italic;
  font-stretch: normal;
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-Extralight-Web-f16cedb1cd63612dcb16352378cc3471.woff2?vsn=d") format("woff2");
  font-weight: 200;
  font-style: normal;
  font-stretch: normal;
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-ThinItalic-Web-f12d7cdc5fd721d6cd3233869da6b049.woff2?vsn=d") format("woff2");
  font-weight: 100;
  font-style: italic;
  font-stretch: normal;
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-Thin-Web-ed4202629d309765bbf67c9a32fe5534.woff2?vsn=d") format("woff2");
  font-weight: 100;
  font-style: normal;
  font-stretch: normal;
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-Italic-VF-Web-70aa7efc280577f2a331d0ed50c026ee.woff2?vsn=d") format("woff2-variations");
}
@font-face {
  font-family: "Graphik Web";
  font-display: block;
  src: url("/fonts/Graphik-Upright-VF-Web-b927e3a8984ae2651912f6283c445376.woff2?vsn=d") format("woff2-variations");
}
.type-h1 {
  font-family: "Graphik Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-feature-settings: "liga", "kern";
  font-weight: 700;
  font-size: 1.75rem;
  line-height: 2rem;
  margin-block: -0.2494em -0.1784em;
}
@media (min-width: 40rem) {
.type-h1 {
    font-size: 2rem;
    line-height: 2.25rem;
    margin-block: -0.2405em -0.1695em
}
  }
.type-h2,
.v2-content .ql-editor h1 {
  font-family: "Graphik Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-feature-settings: "liga", "kern";
  font-weight: 600;
  font-size: 1.375rem;
  line-height: 1.6875rem;
  margin-block: -0.2916em -0.2206em;
}
@media (min-width: 40rem) {
.type-h2,
.v2-content .ql-editor h1 {
    font-size: 1.5rem;
    line-height: 2rem;
    margin-block: -0.3447em -0.2737em
}
  }
.type-h3,
.v2-content .ql-editor h2 {
  font-family: "Graphik Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-feature-settings: "liga", "kern";
  font-weight: 600;
  font-size: 1.25rem;
  line-height: 1.5rem;
  margin-block: -0.278em -0.207em;
}
@media (min-width: 40rem) {
.type-h3,
.v2-content .ql-editor h2 {
    font-size: 1.375rem;
    line-height: 1.6875rem;
    margin-block: -0.2916em -0.2206em
}
  }
.type-body,
.v2-content .ql-editor p,
.v2-content .ql-editor ul,
.v2-content .ql-editor ol {
  font-family: "Graphik Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-feature-settings: "liga", "kern";
  font-size: 1rem;
  line-height: 1.375rem;
}
.type-body:not(.not-trimmed), .v2-content .ql-editor p:not(.not-trimmed), .v2-content .ql-editor ul:not(.not-trimmed), .v2-content .ql-editor ol:not(.not-trimmed) {
    margin-block: -0.3655em -0.2945em;
  }
@media (min-width: 40rem) {
.type-body,
.v2-content .ql-editor p,
.v2-content .ql-editor ul,
.v2-content .ql-editor ol {
    font-size: 1.125rem;
    line-height: 1.5625rem
}

    .type-body:not(.not-trimmed), .v2-content .ql-editor p:not(.not-trimmed), .v2-content .ql-editor ul:not(.not-trimmed), .v2-content .ql-editor ol:not(.not-trimmed) {
      margin-block: -0.3724em -0.3014em;
    }
  }
.type-body strong, .v2-content .ql-editor p strong, .v2-content .ql-editor ul strong, .v2-content .ql-editor ol strong {
    font-weight: 600;
  }
.type-body ul, .v2-content .ql-editor p ul, .v2-content .ql-editor ul ul, .v2-content .ql-editor ol ul {
    margin: 0;
    position: relative;
    right: 4px;
  }
.type-body-micro {
  font-family: "Graphik Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-feature-settings: "liga", "kern";
  font-size: 0.875rem;
  line-height: 1.125rem;
}
.type-body-micro:not(.not-trimmed) {
    margin-block: -0.3209em -0.2499em;
  }
@media (min-width: 40rem) {
.type-body-micro {
    font-size: 1rem;
    line-height: 1.1875rem
}

    .type-body-micro:not(.not-trimmed) {
      margin-block: -0.2718em -0.2008em;
    }
  }
.type-body-micro strong {
    font-weight: 600;
  }
.type-body-micro ul {
    margin: 0;
    position: relative;
    right: 4px;
  }
.type-body-nano {
  font-family: "Graphik Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-feature-settings: "liga", "kern";
  font-size: 0.875rem;
  line-height: 120%;
}
.type-body-nano:not(.not-trimmed) {
    margin-block: -0.278em -0.207em;
  }
@media (min-width: 40rem) {
.type-body-nano {
    font-size: 0.875rem
}
  }
.type-preamble {
  font-family: "Graphik Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-feature-settings: "liga", "kern";
  font-variant: all-small-caps;
  font-weight: 600;

  /* border: solid 1px black; */
  /* cap height = 10px */
  font-size: 1.25rem;
  line-height: 1.5rem;
  margin-block: -0.528em -0.207em;
}
@media (min-width: 40rem) {
.type-preamble {
    /* cap height = 10.725px */
    font-size: 1.375rem;
    line-height: 1.625rem;
    margin-block: -0.4689em -0.1979em
}
  }
.type-button {
  font-family: "Graphik Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-feature-settings: "liga", "kern";
  font-weight: 500;
  font-size: 1.125rem;
  line-height: 1.375rem;
  margin-block: -0.2891em -0.2181em;
}
@media (min-width: 40rem) {
.type-button {
    font-size: 1.25rem;
    line-height: 1.5rem;
    margin-block: -0.278em -0.207em
}
  }
.type-button-cta {
  font-family: "Graphik Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-feature-settings: "liga", "kern";
  font-weight: 500;
  font-size: 1.375rem;
  line-height: 1.625rem;
  margin-block: -0.2689em -0.1979em;
}
@media (min-width: 80rem) {
.type-button-cta {
    font-size: 1.5rem;
    line-height: 1.75rem;
    margin-block: -0.2613em -0.1903em
}
  }
.type-button-micro {
  font-family: "Graphik Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-feature-settings: "liga", "kern";
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.25rem;
}
.type-button-micro:not(.not-trimmed) {
    margin-block: -0.303em -0.232em;
  }
@media (min-width: 80rem) {
.type-button-micro {
    font-size: 1.125rem;
    line-height: 1.375rem
}

    .type-button-micro:not(.not-trimmed) {
      margin-block: -0.2891em -0.2181em;
    }
  }
/* Rename to field label? */
.type-label {
  font-family: "Graphik Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-feature-settings: "liga", "kern";
  font-weight: 600;
  font-size: 1rem;
  line-height: 1.1875rem;
  margin-block: -0.2718em -0.2008em;
}
@media (min-width: 40rem) {
.type-label {
    font-size: 1.125rem;
    line-height: 1.375rem;
    margin-block: -0.2891em -0.2181em
}
  }
.type-input-text,
.type-input-select {
  font-family: "Graphik Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-feature-settings: "liga", "kern";
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.625rem;
}
.type-input-text:not(.not-trimmed), .type-input-select:not(.not-trimmed) {
    margin-block: -0.4002em -0.3292em;
  }
@media (min-width: 40rem) {
.type-input-text,
.type-input-select {
    font-size: 1.25rem;
    line-height: 1.75rem
}

    .type-input-text:not(.not-trimmed), .type-input-select:not(.not-trimmed) {
      margin-block: -0.378em -0.307em;
    }
  }
/* Rename to field error? */
.type-input-error {
  font-family: "Graphik Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-feature-settings: "liga", "kern";
  font-weight: 500;
  font-size: 1rem;
  line-height: 1.125rem;
  margin-block: -0.2405em -0.1695em;
}
@media (min-width: 40rem) {
.type-input-error {
    font-size: 1.125rem;
    line-height: 1.375rem;
    margin-block: -0.2891em -0.2181em
}
  }
/* card status = body micro with weight 600 */
.type-action-link {
  font-family: "Graphik Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-variant: all-small-caps;
  font-feature-settings: "liga", "kern";
  font-weight: 500;
  /* border: solid 1px black; */
  /* cap height = 10px */
  font-size: 1.25rem;
  line-height: 1.5rem;
  margin-block: -0.528em -0.207em;
}
@media (min-width: 40rem) {
.type-action-link {
    /* cap height = 10.725px */
    font-size: 1.375rem;
    line-height: 1.625rem;
    margin-block: -0.4689em -0.1979em
}
  }
.type-pill {
  font-family: "Graphik Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-variant: all-small-caps;
  font-feature-settings: "liga", "kern";
  font-weight: 500;
  font-size: 1rem;
  line-height: 1rem;
}
.type-pill:not(.not-trimmed) {
    margin-block: -0.378em -0.127em;
  }
@media (min-width: 40rem) {
.type-pill {
    font-size: 1.25rem;
    line-height: 1.25rem
}
    .type-pill:not(.not-trimmed) {
      margin-block: -0.408em -0.127em;
    }
  }
.type-progress {
  font-family: "Graphik Web", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-variant: all-small-caps;
  font-feature-settings: "liga", "kern";
  font-weight: 500;
  font-size: 1rem;
  line-height: 1rem;
}
.type-progress:not(.not-trimmed) {
    margin-block: -0.478em -0.407em;
  }
@media (min-width: 40rem) {
.type-progress {
    font-size: 1rem;
    line-height: 1rem
}
    .type-progress:not(.not-trimmed) {
      margin-block: -0.4053em -0.3343em;
    }
  }
.all-caps {
  font-variant: small-caps;
}
.all-small-caps {
  font-variant: all-small-caps;
}
:root {
  --color-header-light: hsl(var(--color-hue) 6% 92%);

  --color-white: white;
  --color-black: #1c1c1c;

  --color-focus-blue: #85adf2;

  --color-gray-1: #f5f5f5;
  --color-gray-2: #e8e8e8;
  --color-gray-3: #d4d4d4;
  --color-gray-4: #a3a3a3;
  --color-gray-5: #858585;
  --color-gray-6: #757575;
  --color-gray-7: #595959;
  --color-gray-8: #414141;

  --color-red-light: #ffeceb;
  --color-red-medium: #c9180c;
  --color-red-dark: #7b0d06;

  --color-green-light: #e6faf7;
  --color-green-medium: #06a28b;
  --color-green-dark: #097061;

  --color-primary: hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
  --color-primary-light: hsl(var(--color-hue), var(--color-saturation), calc(var(--color-lightness) + 5%));
  --color-primary-dark: hsl(var(--color-hue), var(--color-saturation), calc(var(--color-lightness) - 5%));
  --color-primary-offwhite: hsl(var(--color-hue), 100%, 98%);
  --color-primary-muted: hsl(var(--color-hue), 24%, 36%);

  /* Older stuff follows. */
  --color-dark-5: rgba(0 0 0 / 5%);
  --color-dark-10: rgba(0 0 0 / 10%);
  --color-dark-20: rgba(0 0 0 / 20%);
  --color-dark-30: rgba(0 0 0 / 30%);
  --color-dark-40: rgba(0 0 0 / 40%);
  --color-dark-50: rgba(0 0 0 / 50%);
  --color-dark-60: rgba(0 0 0 / 60%);
  --color-dark-70: rgba(0 0 0 / 70%);
  --color-dark-80: rgba(0 0 0 / 80%);
  --color-dark-90: rgba(0 0 0 / 90%);
  --color-dark-95: rgba(0 0 0 / 95%);

  --color-gray-50: #fafafa;
  --color-gray-100: #f5f5f5;
  --color-gray-200: #e5e5e5;
  --color-gray-300: #d4d4d4;
  --color-gray-400: #a3a3a3;
  --color-gray-500: #737373;
  --color-gray-600: #525252;
  --color-gray-700: #404040;
  --color-gray-800: #262626;
  --color-gray-900: #171717;

  --color-primary-100: hsl(var(--color-hue), 36%, 96%);
  --color-primary-200: hsl(var(--color-hue), 30%, 94%);
  --color-primary-300: hsl(var(--color-hue), 24%, 90%);
  --color-primary-400: hsl(var(--color-hue), var(--color-saturation), calc(var(--color-lightness) + 5%));
  --color-primary-500: hsl(var(--color-hue), var(--color-saturation), var(--color-lightness));
  --color-primary-600: hsl(var(--color-hue), var(--color-saturation), calc(var(--color-lightness) - 5%));
  --color-primary-700: hsl(var(--color-hue), 16%, 36%);
  --color-primary-800: hsl(var(--color-hue), 18%, 30%);
  --color-primary-900: hsl(var(--color-hue), 20%, 24%);

  --color-red-50: #fef2f2;
  --color-red-100: #fee2e2;
  --color-red-200: #fecaca;
  --color-red-300: #feb2b2;
  --color-red-400: #fc8181;
  --color-red-500: #f56565;
  --color-red-600: #e53e3e;
  --color-red-700: #c53030;
  --color-red-800: #9b2c2c;
  --color-red-900: #742a2a;

  --color-green-50: #f0fdf4;
  --color-green-100: #dcfce7;
  --color-green-300: #86efac;
  --color-green-500: #22c55e;
  --color-green-700: #15803d;

  --color-orange-50: #fff7ed;
  --color-orange-100: #ffedd5;
  --color-orange-300: #fdba74;
  --color-orange-500: #f97316;
  --color-orange-700: #c2410c;

  --color-yellow-100: #fffff0;
  --color-yellow-200: #fefcbf;
  --color-yellow-300: #faf089;
  --color-yellow-400: #f6e05e;
  --color-yellow-500: #ecc94b;
  --color-yellow-600: #d69e2e;
  --color-yellow-700: #b7791f;
  --color-yellow-800: #975a16;
  --color-yellow-900: #744210;
  --shadow--sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --shadow--md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --shadow--lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --shadow--xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
  --shadow--2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
  --shadow--inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
  --shadow--none: 0 0 #000;

  --min-block--screen: 100vh;
}
.divider {
  border-top: solid 1px var(--color-gray-200);
  border-left: solid 1px var(--color-gray-200);
}
.select-none {
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.v2-content .ql-editor h1,
.v2-content .ql-editor h2,
.v2-content .ql-editor p,
.v2-content .ql-editor ul,
.v2-content .ql-editor ol {
  margin-block: 0px !important;
}
.v2-content .ql-editor h2 {
  margin-bottom: 8px !important;
}
.v2-content .ql-editor h2:not(:first-child) {
  margin-top: 8px !important;
}
.v2-content .ql-editor p:not(:first-child):has(strong:only-child) {
  margin-top: 16px !important;
}
.v2-content .ql-editor p:has(strong:only-child) {
  margin-bottom: 4px !important;
}
.v2-content .ql-editor .ql-video {
  width: 100%;
  aspect-ratio: 16/9;
}
@media (min-width: 40rem) {
.v2-content .ql-editor .ql-video {
    min-height: 300px
}
  }
.v2-content .ql-editor ul li {
  -webkit-padding-start: 12px !important;
          padding-inline-start: 12px !important;
}
@media (min-width: 40rem) {
main {
    margin-inline: 16px;
    margin-block: 64px
    /* relative sm:block-start-16 xl:block-start-0 */
}
  }
@media (min-width: 80rem) {
main {
    margin-inline: 0;
    margin-block: 0
}
  }
.border-header {
  border-bottom: solid 1px var(--color-gray-300);
}
.gc-header a,
  .gc-header a:hover {
    text-decoration: none;
  }
.gc-header .secondary svg {
    width: 18px;
    height: 18px;
    stroke-width: 1.6px;
  }
.gc-header .secondary a.active svg {
    stroke-width: 2px;
  }
.gc-header .skip-nav-links:focus-within {
      border: solid 1px var(--color-dark-10);
      border-top: none;
    }
.gc-header .skip-nav-links a,
    .gc-header .skip-nav-links a:hover {
      border-bottom: none !important;
    }
.gc-header .primary a,
  .gc-header .secondary a {
    color: var(--color-gray-7);
  }
.gc-header .primary a:hover,
  .gc-header .secondary a:hover {
    color: var(--color-black);
  }
.gc-header .primary a.active,
  .gc-header .secondary a.active {
    font-weight: 700;
  }
.secondary-menu {
  border: solid 1px var(--color-gray-300);
}
#sidebar {
  border-bottom: solid 1px var(--color-gray-300);
}
@media (min-width: 80rem) {
#sidebar {
    border-bottom: none
}
  }
#sidebar h3 {
    /* border-bottom: solid 1px var(--color-gray-200); */
  }
#sidebar h3.v2-heading {
    /* border-bottom: solid 1px var(--color-gray-3); */
  }
.trip-name-header {
  border-bottom: none;
}
.box-impersonation-status-bar {
  border-bottom: solid 1px var(--color-gray-300);
}
.design-system .example-box {
    /* background-color: #eee; */
    border: solid 2px;
  }
.design-system .tall {
    min-height: 50vh;
  }
.design-system .example-box.invert {
    background-color: black;
    color: white;
  }
.design-system code {
    background-color: var(--color-gray-100);
    border: solid 1px var(--color-gray-200);
    border-radius: 4px;
    padding-inline: 8px;
  }
.design-system .resizable {
    resize: horizontal;
    overflow: hidden;
  }
.group-fieldset {
  margin-top: 0;
}
/* Nothing here yet */
:root {
  --pad-inline--input: 16px;
  --pad-inline--password: 16px 44px;
  --pad-block--input: 9px 10px;
  --radius--input: 8px;
  --radius--split-input-first: 8px 0px 0px 8px;
  --radius--split-input-last: 0px 8px 8px 0px;
  --radius--checkbox: 5px;
}
@media (min-width: 40rem) {
:root {
    --pad-inline--input: 18px;
    --pad-inline--password: 18px 48px;
    --pad-block--input: 10px 12px;
    --radius--input: 10px
}
  }
.radio-button,
.checkbox {
  -moz-appearance: none;
       appearance: none;
  -webkit-appearance: none;
}
.radio-button:focus-visible,
.checkbox:focus-visible {
  outline: 1.5px solid var(--color-black);
  outline-offset: 0px;
}
@media (min-width: 40rem) {
.radio-button:focus-visible,
.checkbox:focus-visible {
    outline-width: 2px
}
  }
.radio-button:checked {
  box-shadow: 0 0 0 3px var(--color-white) inset;
}
.radio-button:checked:not(:disabled) {
  background-color: var(--color-black);
}
.radio-button:disabled:checked {
  background-color: var(--color-gray-5);
}
.radio-button:disabled:not(:checked) {
  background-color: white;
}
.checkbox:checked {
  background: url("../static/svg/generic/checkbox-checkmark.svg") no-repeat center;
}
.checkbox:disabled {
  background-color: white;
  opacity: 0.48;
}
select.input-select {
  background-image: url("../static/icons/custom/select-caret.svg");
  background-size: 20px;
}
@media (min-width: 40rem) {
select.input-select {
    background-size: 22px
}
  }
.icon:not(.hidden) {
  display: inline-flex;
  align-items: center;
}
.icon svg {
  height: 100%;
  aspect-ratio: 1/1;
}
:root {
  --pad-inline--button: 16px;
  --radius--button: 8px;
  --radius--button-cta: 10px;
  --radius--button-micro: 6px;
}
@media (min-width: 40rem) {
:root {
    --pad-inline--button: 18px;
    --radius--button: 10px;
    --radius--button-cta: 12px;
    --radius--button-micro: 8px
}
  }
.type-button-micro {
  --pad-block--button: 16px;
}
@media (min-width: 80rem) {
.type-button-micro {
    --pad-block--button: 15px 17px
}
  }
.v2-button {
  outline-offset: 3px;
}
.v2-button:hover {
    cursor: pointer;
  }
.v2-button:disabled:hover {
  background-color: var(--color-primary);
}
.v2-button.secondary:disabled:hover,
.v2-button.ghost:disabled:hover {
  background-color: var(--color-white);
  color: var(--color-black);
}
:root {
  --radius--pill: 8px;
}
@media (min-width: 40rem) {
:root {
    --radius--pill: 10px
}
  }
@media (min-width: 80rem) {
:root {
    --radius--pill: 12px
}
  }
.card-label:has(input:checked) {
  background-color: var(--color-primary-offwhite);
}
ul.card-list {
  margin-left: 16px;
  padding-right: 28px;
}
ul.card-list li {
  padding-left: 6px;
}
@media (min-width: 40rem) {
ul.card-list li {
    padding-left: 10px
}
  }
.error-summary-card {
  border-left-width: 8px;
  border-color: var(--color-red-medium);
}
.card-label:has(input[type=radio]) {
  box-shadow: 0px 2px 2px 0px rgba(0, 0, 0, 0.10);
}
.lesser-cards {
  display: flex;
  flex-direction: column;
}
@media (min-width: 55rem) {
.lesser-cards {
    flex-direction: row;
    align-items: stretch
}
  }
.inverted-cluster {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media (min-width: 55rem) {
.inverted-cluster {
    flex-direction: column;
    align-items: start
}
  }
.traveler-row {
  border-bottom: solid 1px var(--color-gray-3);
}
@media (min-width: 40rem) {
.traveler-row {
    padding-inline: 8px;
    position: relative;
    inset-inline-start: -8px;
    inline-size: calc(100% + 16px)
}
a.traveler-row:hover {
    background-color: var(--color-primary-offwhite)
}
  }
.traveler-key-value {
  display: flex;
  align-items: start;
  flex-direction: column;
}
@media (min-width: 55rem) {
.traveler-key-value {
    flex-direction: row;
    align-items: center
}
  }
.progress-row {
  position: relative;
  inset-inline-start: -20px;
  width: calc(100% + 32px);
  overflow-x: auto;
  padding-top: 8px;
  padding-bottom: 24px;
  margin-bottom: -32px;
}
@media (min-width: 40rem) {
.progress-row {
    padding-top: 8px;
    padding-bottom: 32px;
    margin-bottom: -24px;
    width: calc(100% + 44px)
}
  }
.progress-line:not(:last-of-type) {
  border: solid 0.5px var(--color-gray-7);
  flex-grow: 1;
  position: relative;
  inset-block-end: 7px;
  margin-inline: -27px;
  min-width: 60px;
}
.pie {
  border-radius: 50%;
  background-color: white;
  background-image: linear-gradient(to right, transparent 50%, var(--color-gray-7) 0);
  border: solid 1px var(--color-gray-7);
}
.pie.active {
    background-image: linear-gradient(to right, transparent 50%, var(--color-primary-muted) 0);
    border: solid 1px var(--color-primary-muted);
  }
.pie-2 {
  content: "";
  display: block;
  margin-left: 50%;
  height: 100%;
  border-radius: 0 100% 100% 0 / 50%;
  transform-origin: left;
}
.pie-2:not(.active):not(.over-50) {
    background-color: inherit;
  }
.pie-2:not(.active).over-50 {
    background-color: var(--color-gray-7);
  }
.pie-2.active:not(.over-50) {
    background-color: inherit;
  }
.pie-2.active.over-50 {
    background-color: var(--color-primary-muted);
  }
.switch-background {
  transition: all 0.3s ease-out;
}
.switch-button {
  transition: all 0.15s ease-out;
  cursor: pointer;
}
.switch-button:hover {
    background-color: white;
  }
.switch-button:disabled {
  opacity: 1;
}
/* Fix this stupid default on the Tailwind reset */
ol {
  list-style-type: decimal;
}
/* Fix this stupid default on the Tailwind reset */
ol {
  list-style-type: decimal;
}
/* Fix this stupid default on the Tailwind reset */
ol {
  list-style-type: decimal;
}
/* Legacy border classes for Tailwind compat.
  They have to go here so they override the Spritz stuff.
  I will probably do border--top etc. in Spritz in a week or so. */
.border-t {
  border: solid var(--color-gray-200);
  border-width: 1px 0px 0px 0px;
}
.border-b {
  border: solid var(--color-gray-200);
  border-width: 0px 0px 1px 0px;
}
.border-not-b {
  border: solid var(--color-gray-200);
  border-width: 1px 1px 0px 1px;
}
.border-y {
  border: solid var(--color-gray-200);
  border-width: 1px 0px;
}