@font-face{font-family:Metric;font-style:normal;font-weight:400;src:url(fonts/MetricWeb-Regular.woff2) format("woff2")}@font-face{font-family:Metric;font-style:italic;font-weight:400;src:url(fonts/MetricWeb-RegularItalic.woff2) format("woff2")}@font-face{font-family:Metric;font-style:normal;font-weight:500;src:url(fonts/MetricWeb-Medium.woff2) format("woff2")}@font-face{font-family:Metric;font-style:italic;font-weight:500;src:url(fonts/MetricWeb-MediumItalic.woff2) format("woff2")}@font-face{font-family:Metric;font-style:normal;font-weight:600;src:url(fonts/MetricWeb-Semibold.woff2) format("woff2")}@font-face{font-family:Metric;font-style:italic;font-weight:600;src:url(fonts/MetricWeb-SemiboldItalic.woff2) format("woff2")}.khq-absolute{position:absolute}.khq-relative{position:relative}.khq-top-0{top:0px}.khq-m-auto{margin:auto}.khq-my-base{margin-top:1rem;margin-bottom:1rem}.khq-mb-16{margin-bottom:4rem}.khq-mb-3xlarge{margin-bottom:2.5rem}.khq-mb-base{margin-bottom:1rem}.khq-mb-xlarge{margin-bottom:1.5rem}.khq-ml-2xsmall{margin-left:0.25rem}.khq-mt-2xlarge{margin-top:2rem}.khq-mt-base{margin-top:1rem}.khq-inline{display:inline}.khq-flex{display:flex}.khq-h-\[10px\]{height:10px}.khq-h-\[56px\]{height:56px}.khq-h-full{height:100%}.khq-h-screen{height:100vh}.khq-min-h-0{min-height:0px}.khq-w-1\/2{width:50%}.khq-w-11\/12{width:91.666667%}.khq-w-\[100px\]{width:100px}.khq-w-\[17\%\]{width:17%}.khq-w-\[400px\]{width:400px}.khq-w-full{width:100%}.khq-min-w-\[1024px\]{min-width:1024px}.khq-max-w-3xl{max-width:48rem}.khq-max-w-\[960px\]{max-width:960px}.khq-max-w-xs{max-width:20rem}.khq-shrink-0{flex-shrink:0}.khq-flex-grow{flex-grow:1}.khq-grow{flex-grow:1}.khq-cursor-pointer{cursor:pointer}.khq-flex-row{flex-direction:row}.khq-flex-col{flex-direction:column}.khq-items-center{align-items:center}.khq-justify-end{justify-content:flex-end}.khq-justify-center{justify-content:center}.khq-justify-between{justify-content:space-between}.khq-gap-2xsmall{gap:0.25rem}.khq-gap-large{gap:1.25rem}.khq-gap-xsmall{gap:0.5rem}.khq-overflow-auto{overflow:auto}.khq-overflow-hidden{overflow:hidden}.khq-overflow-ellipsis{text-overflow:ellipsis}.khq-whitespace-nowrap{white-space:nowrap}.khq-rounded-max{border-radius:999px}.khq-bg-background-primary{--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.khq-bg-background-secondary{background-color:#0d0d0d0d}.khq-bg-gray-800{--tw-bg-opacity:1;background-color:rgb(44 44 44 / var(--tw-bg-opacity))}.khq-bg-sentiment-action{--tw-bg-opacity:1;background-color:rgb(43 110 213 / var(--tw-bg-opacity))}.khq-p-\[88px\]{padding:88px}.khq-px-2xlarge{padding-left:2rem;padding-right:2rem}.khq-px-base{padding-left:1rem;padding-right:1rem}.khq-px-large{padding-left:1.25rem;padding-right:1.25rem}.khq-py-base{padding-top:1rem;padding-bottom:1rem}.khq-py-large{padding-top:1.25rem;padding-bottom:1.25rem}.khq-text-left{text-align:left}.khq-text-center{text-align:center}.khq-text-\[34px\]{font-size:34px}.khq-text-xlarge{font-size:1.25rem;line-height:1.2}.khq-font-medium{font-weight:500}.khq-font-semibold{font-weight:600}.khq-text-foreground-primary{--tw-text-opacity:1;color:rgb(13 13 13 / var(--tw-text-opacity))}.khq-text-foreground-secondary{color:#0d0d0d99}.khq-text-inverted-foreground-primary{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))}/* styles for karbonhq-fe-login/styles/base-styles.m.css *//*
Import Snippets

@value base: 'staging-app/styles/base-styles.m.css';

@value sp025, sp05, sp1, sp2, sp3, sp4, sp5, sp6, sp7 ,sp8, sp12, sp14, sp16 from base;

 *//**
* Colors
*/:root {
  --color-white: #ffffff;
  --color-black: #000000;

  --color-grey-50: #fafafa;
  --color-grey-100: #f2f2f2;
  --color-grey-200: #dddddd;
  --color-grey-300: #cacaca;
  --color-grey-400: #b0b0b0;
  --color-grey-500: #888888;
  --color-grey-600: #6a6a6a;
  --color-grey-700: #4b4b4b;
  --color-grey-800: #2c2c2c;
  --color-grey-900: #0d0d0d;

  --color-coral-50: #fef5f5;
  --color-coral-100: #fceae8;
  --color-coral-200: #fad9d5;
  --color-coral-300: #f6b8b1;
  --color-coral-400: #ff9c92;
  --color-coral-500: #ee7f73;
  --color-coral-600: #e07064;
  --color-coral-700: #9f4b44;
  --color-coral-800: #622621;
  --color-coral-900: #2a0909;

  --color-gold-50: #6d170d;
  --color-gold-100: #fcf5e9;
  --color-gold-200: #fdf1dd;
  --color-gold-300: #fde4bb;
  --color-gold-400: #f8d8a3;
  --color-gold-500: #eec684;
  --color-gold-600: #deab55;
  --color-gold-700: #997135;
  --color-gold-800: #4d3619;
  --color-gold-900: #2a1809;

  --color-blue-50: ##eff7fe;
  --color-blue-100: #d9ebfd;
  --color-blue-200: #b9d4f6;
  --color-blue-300: #8bb3eb;
  --color-blue-400: #558cdf;
  --color-blue-500: #2b6ed5;
  --color-blue-600: #2461bd;
  --color-blue-700: #1d53a4;
  --color-blue-800: #16458b;
  --color-blue-900: #0f3874;

  --color-orange-50: #fef9f4;
  --color-orange-100: #fcf2e8;
  --color-orange-200: #f6d6b7;
  --color-orange-300: #f1b885;
  --color-orange-400: #ec9a53;
  --color-orange-500: #e77c21;
  --color-orange-600: #b3601b;
  --color-orange-700: #7f4413;
  --color-orange-800: #4b280b;
  --color-orange-900: #170c03;

  --color-green-50: #f4fbf0;
  --color-green-100: #f1f9eb;
  --color-green-200: #d0e8bf;
  --color-green-300: #aed892;
  --color-green-400: #8cc865;
  --color-green-500: #6ab838;
  --color-green-600: #538f2d;
  --color-green-700: #3b6620;
  --color-green-800: #233d13;
  --color-green-900: #0b1406;

  --color-red-50: #fcf0f4;
  --color-red-100: #f8e0e8;
  --color-red-200: #f0b1bb;
  --color-red-300: #e67a85;
  --color-red-400: #df505c;
  --color-red-500: #d10615;
  --color-red-600: #b40815;
  --color-red-700: #940a14;
  --color-red-800: #770c13;
  --color-red-900: #580d12;

  --color-primary: var(--color-blue-500);
  --color-primary-200: var(--color-blue-200);

  --border-standard: 1px solid var(--color-grey-300);
  --border-standard-radius: 5px;

  --z-index-drop-down: 20;
  --z-index-bottom-bar: 15;
}/* These are so we can pass colors in as component props */._text-white_o1oola {
  color: var(--color-white);
}._text-black_o1oola {
  color: var(--color-black);
}._text-grey-300_o1oola {
  color: var(--color-grey-300);
}._text-grey-400_o1oola {
  color: var(--color-grey-400);
}._text-grey-500_o1oola {
  color: var(--color-grey-500);
}._text-grey-600_o1oola {
  color: var(--color-grey-600);
}._text-grey-900_o1oola {
  color: var(--color-grey-900);
}._text-blue-500_o1oola {
  color: var(--color-blue-500);
}._text-green-500_o1oola {
  color: var(--color-green-500);
}._text-red-500_o1oola {
  color: var(--color-red-500);
}._text-orange-500_o1oola {
  color: var(--color-orange-500);
}._text-orange-400_o1oola {
  color: var(--color-orange-400);
}._text-coral-500_o1oola {
  color: var(--color-coral-500);
}/**
* Typography
*/._text-base_o1oola {
  font-size: 16px;
  line-height: 20px;
}._text-xs_o1oola {
  font-size: 12px;
  line-height: 16px;
}._text-sm_o1oola {
  font-size: 14px;
  line-height: 16px;
}._text-lg_o1oola {
  font-size: 18px;
  line-height: 20px;
}._text-xl_o1oola {
  font-size: 20px;
  line-height: 24px;
}._text-2xl_o1oola {
  font-size: 24px;
  line-height: 28px;
}._text-3xl_o1oola {
  font-size: 30px;
  line-height: 32px;
}._text-4xl_o1oola {
  font-size: 36px;
  line-height: 40px;
}._text-5xl_o1oola {
  font-size: 48px;
  line-height: 52px;
}._text-6xl_o1oola {
  font-size: 60px;
  line-height: 64px;
}._text-normal_o1oola {
  font-weight: 400;
}._text-medium_o1oola {
  font-weight: 500;
}._text-semibold_o1oola {
  font-weight: 600;
}._text-center_o1oola {
  text-align: center;
}._text-italic_o1oola {
  font-style: italic;
}._text-uppercase_o1oola {
  text-transform: uppercase;
}._text-active-primary_o1oola:hover {
  color: var(--color-blue-500);
}._text-active-underline_o1oola:hover {
  text-decoration: underline;
}._text-underline_o1oola {
  text-decoration: underline;
}._text-form-label_o1oola {
  color: var(--color-grey-600);
  font-size: 14px;
  line-height: 16px;
  font-weight: 500;
  text-transform: uppercase;
}._text-form-description_o1oola {
  color: var(--color-grey-600);
  font-style: italic;
}._text-section-header_o1oola {
  color: black;
  font-size: 20px;
  line-height: 24px;
  font-weight: 600;
}._text-sub-header_o1oola {
  color: black;
  font-size: 16px;
  line-height: 20px;
  font-weight: 600;
}._text-ellipses_o1oola {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}/* handles base 2 line text with ellispes.  */._text-two-line-truncated_o1oola {
  display: block; /* Fallback for non-webkit */
  display: -webkit-box;
  max-height: 640px; /* Fallback for non-webkit ($font-size * $line-height * $lines-to-show) */
  font-size: 16px;
  line-height: 20px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  padding: 0;
}/**
* Spacing
*//**
 * Globals
 * These are convenience globals to allow basic position without the need to
 * create new local classes to override them.
 */$spaces: (0, 4px, 8px, 12px, 16px, 20px, 24px, 28px, 32px, 36px, 40px, 44px, 48px, 56px, 64px, 80px);/* margins
  .glob-mt0 -> .glob-mt20
  .glob-mr0 -> .glob-mr20
  .glob-mb0 -> .glob-mb20
  .glob-ml0 -> .glob-ml20
  .glob-mh0 -> .glob-mh20
  .glob-mv0 -> .glob-mv20
*/@each $val $i in $spaces {
  .glob-mt$(i) {
    margin-top: $(val);
  }
  .glob-mr$(i) {
    margin-right: $(val);
  }
  .glob-mb$(i) {
    margin-bottom: $(val);
  }
  .glob-ml$(i) {
    margin-left: $(val);
  }
  .glob-mh$(i) {
    margin-left: $(val);
    margin-right: $(val);
  }
  .glob-mv$(i) {
    margin-top: $(val);
    margin-bottom: $(val);
  }
}/* padding
  .glob-pt0 -> .glob-pt20
  .glob-pr0 -> .glob-pt20
  .glob-pb0 -> .glob-pb20
  .glob-pl0 -> .glob-pl20
  .glob-ph0 -> .glob-ph20
  .glob-pv0 -> .glob-pv20
*/@each $val $i in $spaces {
  .glob-pt$(i) {
    padding-top: $(val);
  }
  .glob-pr$(i) {
    padding-right: $(val);
  }
  .glob-pb$(i) {
    padding-bottom: $(val);
  }
  .glob-pl$(i) {
    padding-left: $(val);
  }
  .glob-ph$(i) {
    padding-left: $(val);
    padding-right: $(val);
  }
  .glob-pv$(i) {
    padding-top: $(val);
    padding-bottom: $(val);
  }
}.glob-clear-margin {
  margin: 0;
}.glob-hr {
  border-bottom: 1px solid var(--color-grey-300);
  width: 100%;
}.add-pointer {
  cursor: pointer;
}/*
* Borders
*//*
* Shadow Depths
* @TODO: To do be design spec'ed.
*/._depth-1_o1oola {
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
}._depth-2_o1oola {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}._depth-3_o1oola {
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.14);
}._depth-dropdown_o1oola {
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.16);
}._depth-modal_o1oola {
  box-shadow: 0 0 16px rgba(0, 0, 0, 0.2);
}/*
* Plates
*/._plate-standard_o1oola {
  border: 1px solid var(--color-grey-300);
  border-radius: 5px;
  background-color: var(--color-white);
}._plate-dropdown_o1oola {
  border-radius: 5px;
  background-color: var(--color-white);
}._plate-modal_o1oola {
  border-radius: 5px;
  background-color: var(--color-white);
}._plate-list-item_o1oola {
  border: 1px solid var(--color-grey-300);
  border-radius: 4px;
  background-color: var(--color-white);
}.plate-modal-panel {
  border: 1px solid var(--color-grey-300);
  border-radius: 6px;
  background-color: var(--color-grey-100);
  padding: 16px;
}@keyframes _fadeIn_o1oola {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}._fade_o1oola {
  animation-duration: 1s;
  animation-name: _fadeIn_o1oola;
}/* Focus States *//* Using the :focus-visible spec where available to add a custom focus ring but only on keyboard events (not clicks) */._focus-ring_o1oola {
  outline: none;
}._focus-ring_o1oola:focus:focus-visible {
  box-shadow: 0 0 0 3px var(--color-blue-300);
}/* styles for karbonhq-fe-login/components/login-header.m.css */._login-header_uwm1rf {
  width: 100%;
  min-height: 74px;
  margin: 0;
  padding: 17px 0;
  background: var(--color-grey-800);
  color: var(--color-white);
}._login-header__inner_uwm1rf {
  position: relative;
  margin-right: auto;
  margin-left: auto;
  padding: 0 15px;
  max-width: 990px;
}._login-header__logo_uwm1rf {
  display: block;
  float: left;
  overflow: hidden;
  width: 121px;
  height: 42px;
  opacity: 1;
}._login-header__nav_uwm1rf {
  text-align: right;
  /* this is to simulate the nav on the website */
  padding-top: 2px;
  /* maintain the height wehn the get button is not there */
  min-height: 42px;
}._login-header__nav_uwm1rf a,
._login-header__nav_uwm1rf a:active,
._login-header__nav_uwm1rf a:hover,
._login-header__nav_uwm1rf a:visited {
  color: var(--color-white);
}._login-header__link_uwm1rf {
  display: none;
  font-size: 20px;
  opacity: 0.5;
  margin: 4px;
}@media screen and (min-width: 600px) {._login-header__link_uwm1rf {
    display: inline-block
}
  }._login-header__get-action_uwm1rf {
  display: inline-block;
  height: 40px;
  padding: 0 1em;
  margin-left: 12px;
  transition: all 0.1s ease-out;
  line-height: 36px;
  border: 2px solid rgba(255, 255, 255, 0.3);
  color: #fff;
  background-color: transparent;
  border-radius: 10em;
  text-transform: uppercase;
}._login-header__get-action_uwm1rf:hover {
  background: var(--color-blue-500);
  border-color: transparent;
}/* Branded overrides */._co-brand-intuit_uwm1rf ._login-header-bar_uwm1rf {
  display: flex;
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  min-height: 56px;
  height: 56px;
  background-color: var(--color-black);
  z-index: 50;
}/* styles for karbonhq-fe-login/components/shared/dropdowns/standard-dropdown.m.css */._dropdown__label--truncate_kxzafq {
}._dropdown-field_kxzafq {
  width: 100%;
  border: 1px solid var(--color-grey-300);
  border-radius: 4px;
  display: flex;
  justify-content: space-between;
  cursor: pointer;
  height: 40px;
  padding: 0 12px;
  align-items: center;
}._dropdown-field_kxzafq._error_kxzafq {
  border: 1px solid var(--color-orange-500);
}._error-text_kxzafq {
  color: var(--color-orange-500);
  font-weight: 500;
}._dropdown-field_kxzafq:focus {
  outline: none;
  border-color: #9f9f9f;
}._mod-large_kxzafq {
  height: 48px;
}._standard-dropdown_kxzafq ._dropdown-pane_kxzafq {
  /* fill the width of the button and extend outside if content requires it to do so */
  width: 100%;
  min-width: -moz-max-content;
  min-width: max-content;
  max-height: 380px;
  overflow-y: auto;
  position: absolute;
  z-index: var(--z-index-drop-down);
  top: 0;
}._dropdown-pane-wrapper_kxzafq {
  position: relative;
}/* styles for karbonhq-fe-login/components/shared/forms/check-box.m.css */._checkbox_18jp2s {
  display: flex;
  align-items: center;
  position: relative;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}._label_18jp2s {
  cursor: pointer;
  margin-left: 8px;
}._checkbox_18jp2s._checked_18jp2s._strike-on-complete_18jp2s ._label_18jp2s {
  text-decoration: line-through;
}._icon_18jp2s {
  position: relative;
  border-radius: 4px;
  width: 17px;
  height: 17px;
  border: 1px solid var(--color-grey-300);
  outline: none;
  box-sizing: border-box;
  background-color: var(--color-white);
}._icon-tick_18jp2s {
  position: absolute;
  top: 1px;
  left: 2px;
  width: 12px;
  opacity: 0;
}._icon-dash_18jp2s {
  position: absolute;
  top: 8px;
  left: 4px;
  opacity: 0;
}/* Checked State */._checkbox_18jp2s._checked_18jp2s ._icon_18jp2s ._icon-tick_18jp2s {
  opacity: 1;
}._checkbox_18jp2s._checked_18jp2s ._icon_18jp2s ._icon-tick_18jp2s path {
  /* adding a fill color to this icon messes it up */
  fill: none;
}._checkbox_18jp2s._checked_18jp2s ._icon_18jp2s {
  background-color: var(--color-grey-300);
}/* Partially Checked State (for multiselect group items) */._checkbox_18jp2s._parially-checked_18jp2s ._icon_18jp2s ._icon-dash_18jp2s {
  opacity: 1;
}._checkbox_18jp2s._parially-checked_18jp2s ._icon_18jp2s {
  background-color: var(--color-grey-300);
}/* Disabled State */._checkbox_18jp2s._disabled_18jp2s {
  color: var(--color-grey-400);
  cursor: default;
}._checkbox_18jp2s._disabled_18jp2s input ~ ._icon_18jp2s {
  opacity: 0.7;
}/* Focus State *//* Using the :focus-visible spec where available to add a custom focus ring but only on keyboard events (not clicks) *//* Note: .focus-visble class required in the DOM for Firefox (as focus:focus-visible becomes focus.focus-visible) */._checkbox_18jp2s ._icon_18jp2s:focus:focus-visible {
  border: 1px solid var(--color-blue-300);
  box-shadow: 0 0 0 1px var(--color-blue-300);
}._checkbox_18jp2s ._icon_18jp2s:focus:not(:focus-visible) {
  border: 1px solid var(--color-grey-300);
  box-shadow: none;
}/* styles for karbonhq-fe-login/components/shared/icons/icon.m.css *//*  Supported color pallete for icons. Will need to extend */._icon_1s8hrg {
  /* prevent icons getting squashed (and scaled down) in flex layouts */
  flex-shrink: 0;
}._icon_1s8hrg:not(._default-color_1s8hrg) path {
  fill: currentColor;
}/* styles for karbonhq-fe-login/components/shared/lists/selection-list.m.css */._root_14gg0z {
  display: flex;
  flex-direction: column;
  padding: 0;
  width: -moz-max-content;
  width: max-content;
}._list-items_14gg0z {
  position: relative;
}._limitedHeight_14gg0z {
  max-height: 250px;
}._list-item_14gg0z {
  color: var(--color-black);
  display: flex;
  flex-direction: row;
  align-items: center;
  cursor: pointer;
  padding: 0 20px 0 20px;
  min-height: 38px;
  padding-top: 6px;
  padding-bottom: 6px;
}._list-item_14gg0z:hover {
  background-color: var(--color-grey-100);
}._list-item--disabled_14gg0z:hover {
  background-color: transparent;
}._list-item-label_14gg0z {
  position: relative;
  flex-grow: 1;
  word-break: normal;
}._list-item-label_14gg0z._truncated_14gg0z {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}._selectable_14gg0z ._list-item-label_14gg0z {
  padding-right: 30px;
}._selectable_14gg0z ._list-item-label_14gg0z._truncated_14gg0z {
  padding-right: 0;
}._selectable_14gg0z ._list-item-description_14gg0z {
  padding-right: 12px;
}._list-item__tag_14gg0z {
  border: 1px solid #aaa;
  padding: 0 4px 2px 4px;
  border-radius: 12px;
  color: #999;
  margin-left: 8px;
  font-variant: all-small-caps;
}._list-item-description_14gg0z {
  color: var(--color-grey-500);
  text-align: right;
}._list-item-icon_14gg0z {
  width: 40px;
  position: absolute;
  right: 0;
  height: 10px;
}._header_14gg0z {
  padding: 0 20px 0 20px;
  height: 40px;
  display: flex;
  align-items: center;
}._list-item--nav-selection_14gg0z:not(._list-item--disabled_14gg0z) {
  background-color: var(--color-grey-100);
}._list-item--divider_14gg0z {
  padding: 0 20px 0 20px;
  border-top: 1px solid var(--color-grey-300);
}._list-item--divider-below_14gg0z {
  padding: 0 20px 0 20px;
  border-bottom: 1px solid var(--color-grey-300);
}._list-item--disabled_14gg0z {
  cursor: default;
  color: var(--color-grey-500);
}._mod-panel_14gg0z {
}._mod-dropdown_14gg0z {
}._mod-panel_14gg0z ._list-item_14gg0z:first-child,
._list-item_14gg0z:first-child:hover {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}._mod-panel_14gg0z ._list-item_14gg0z:last-child,
._list-item_14gg0z:last-child:hover {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}._mod-depth-1_14gg0z {
}._mod-depth-2_14gg0z {
}._mod-comfortable_14gg0z ._header_14gg0z {
    height: 48px;
  }._mod-comfortable_14gg0z ._list-item_14gg0z {
    height: 52px;
  }/* styles for karbonhq-fe-login/components/shared/text/label.m.css */._label_1mn40y {
  padding: 0;
  display: block;
  margin-bottom: 4px;
}._mod-no-margin_1mn40y {
  margin-bottom: 0;
}/* styles for karbonhq-fe-login/components/login-footer.m.css */._login__terms-text_178v73 {
  text-align: center;
  color: var(--color-black);
  margin: 64px;
  font-size: 16px;
}._login__terms-text_178v73 a {
  text-decoration: underline;
}/* styles for karbonhq-fe-login/components/login-options.m.css */._centered-column_1k4gnh {
  width: auto;
  margin: auto;
  max-width: 942px;
  padding: 20px 20px 65px;
}._login__content_1k4gnh {
  flex-grow: 1;
  text-align: center;
  padding-top: 120px;
  font-size: 20px;
  color: var(--color-black);
}._login__title_1k4gnh {
  text-align: center;
  max-width: 640px;
  margin: 0 auto 24px;
  color: var(--color-black);
  font-weight: 600;
  font-size: 32px;
  line-height: 38px;
}@media screen and (min-width: 600px) {._login__title_1k4gnh {
    font-size: 38px;
    line-height: 52px
}
  }._login__message_1k4gnh {
  margin: 24px auto 48px auto;
  max-width: 420px;
}._login__login-button-container_1k4gnh {
  margin-top: 64px;
}._login__login-button-container_1k4gnh button {
  padding-top: 0;
}._grant-access-form_1k4gnh {
  width: 212px;
  margin: 16px auto;
  display: block;
}._login-button_1k4gnh {
  position: relative;
  text-align: left;
  width: 100%;
  height: 48px;
  display: block;
  color: #757575;
  background-color: var(--color-white);
  border: none;
  border-radius: 5px;
  font-weight: 500;
  font-size: 18px;
  box-shadow: 0px 1px 2px 0 rgba(0, 0, 0, 0.2);
  cursor: pointer;
  padding: 0 6px;
}a._login-button_1k4gnh,
a._login-button_1k4gnh:active,
a._login-button_1k4gnh:hover,
a._login-button_1k4gnh:visited {
  color: #757575;
}._login-button-content_1k4gnh {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  height: 48px;
}._login-button-image_1k4gnh {
  border-right: 1px solid #ccc;
  height: 48px;
  padding-top: 12px;
  text-align: center;
  width: 34px;
}._login-button-image_1k4gnh._exchange_1k4gnh {
  margin-left: 6px;
}._login-button-text_1k4gnh {
  padding-top: 12px;
  padding-left: 8px;
  height: 48px;
}*,
:after,
:before {
  box-sizing: border-box;
}html {
  overflow: hidden;
}body {
  margin: 0;
  height: 100%;
  width: 100%;
  font-family: Metric, sans-serif;
  font-size: 16px;
  background-color: #f2f2f2;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}button {
  font-family: Metric, sans-serif;
}input[type='checkbox'],
input[type='radio'] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}a {
  color: var(--color-blue-600);
  text-decoration: none;
}/* We have some legacay global styles to account for, need to migrate to either css modules or preferably tailwind */.centered-column {
  width: auto;
  margin: auto;
  max-width: 942px;
  padding: 20px 20px 65px;
}.login {
  color: var(--color-black);
  display: flex;
  flex-direction: column;
  height: 100vh;
}.login__content {
  flex-grow: 1;
  text-align: center;
  padding-top: 120px;
  font-size: 20px;
  color: var(--color-black);
}.login__title {
  text-align: center;
  max-width: 640px;
  margin: 0 auto 24px;
  color: var(--color-black);
  font-weight: 600;
  font-size: 32px;
  line-height: 38px;
}@media screen and (min-width: 600px) {.login__title {
    font-size: 38px;
    line-height: 52px
}
  }.login__message {
  margin: 24px auto 48px auto;
  max-width: 420px;
}.login__message a,
.login__message a:active,
.login__message a:hover,
.login__message a:visited {
  color: #000;
  text-decoration: underline;
}a.login__action-button {
  font-size: 18px;
  background-color: var(--color-blue-500);
  border-radius: 99px;
  padding: 12px 24px;
  color: var(--color-white);
}.\[\&\>div\]\:khq-border-sentiment-warning>div{--tw-border-opacity:1;border-color:rgb(231 124 33 / var(--tw-border-opacity))}