/* Note on css layers: css @layer rules are used to create a layering system for the css.
   The order of the layers is important as it determines the precedence of the styles.
   The layers are defined in the following order:
   1. reset: for resetting default browser styles
   2. utilities: for utility classes that can be used throughout the application
   3. boxelComponentL1: for base component styles
   4. boxelComponentL2: for component styles that build on top of base styles
   5. boxelComponentL3: for component styles that build on top of L2 styles
   This layering system allows for easier overrides and customizations of styles at different levels.
   More info: https://developer.mozilla.org/en-US/docs/Web/CSS/@layer
*/
@layer reset, utilities, boxelComponentL1, boxelComponentL2, boxelComponentL3;

@layer reset {
  * {
    box-sizing: border-box;
  }

  :root {
    @supports (interpolate-size: allow-keywords) {
      interpolate-size: allow-keywords;
    }
  }

  #isolated-render {
    display: none;
  }

  html,
  body {
    height: 100%;
  }

  body {
    margin: 0;
    color: var(--boxel-dark, #000);
    font-family: var(
      --boxel-font-family,
      'IBM Plex Sans',
      'Helvetica Neue',
      Arial,
      sans-serif
    );
    font-size: var(--boxel-body-font-size, 0.875rem);
    letter-spacing: var(--boxel-lsp-xs, 0.01em);
    line-height: var(--boxel-line-height-sm, calc(18 / 13));
    background-color: var(--boxel-light, #fff);
    overscroll-behavior: none;
  }

  body.has-modal {
    overflow: hidden;
  }

  code,
  pre,
  kbd,
  samp {
    font-family: var(
      --boxel-monospace-font-family,
      'IBM Plex Mono',
      'Menlo',
      'Courier New',
      Courier,
      monospace
    );
  }

  a {
    display: inline-block;
    color: inherit;
    text-decoration: none;
  }

  button {
    display: inline-block;
    font: inherit;
  }

  img,
  svg {
    display: inline-block;
    max-width: 100%;
  }

  [alt] {
    color: currentColor;
    font: var(--boxel-font-xs);
    letter-spacing: var(--boxel-lsp-sm);
  }

  a:hover {
    color: var(--boxel-highlight);
    cursor: pointer;
  }

  a:focus {
    outline: var(--boxel-outline);
  }

  a:focus:not(:focus-visible) {
    outline-color: transparent;
  }

  button:hover:not(:disabled),
  [role='button']:hover:not(:disabled, [aria-disabled='true']) {
    cursor: pointer;
  }

  button:focus:not(:disabled),
  [role='button']:focus:not(:disabled) {
    outline: var(--boxel-outline);
  }

  button:focus:not(:focus-visible),
  [role='button']:focus:not(:focus-visible) {
    outline-color: transparent;
  }

  button,
  input,
  select,
  textarea {
    font: inherit;
    letter-spacing: inherit;
  }

  input:not([type='color']):disabled,
  select:disabled,
  textarea:disabled {
    opacity: 0.5;
  }

  input[type='color']:disabled {
    pointer-events: none;
  }

  input:focus:not(:focus-visible),
  textarea:focus:not(:focus-visible) {
    outline-color: transparent;
  }

  input:focus-visible,
  textarea:focus-visible {
    outline-color: var(--boxel-highlight);
  }
}

@layer utilities {
  .boxel-contents-only {
    display: contents;
  }

  /* Hides content visually only
  (accessible via screen readers) */
  .boxel-sr-only:not(:focus):not(:active) {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    border: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    overflow: hidden;
    white-space: nowrap;
  }

  /* may need to add "max-width: 100%;" in some cases */
  .boxel-ellipsize {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* can be used via `--boxel-infinite-spin-animation` css-variable. example:
    @media (prefers-reduced-motion: no-preference) {
      .loading-icon {
        animation: var(--boxel-infinite-spin-animation);
      }
    }
  */
  @keyframes boxel-spin {
    to {
      transform: rotate(360deg);
    }
  }
}

#ember-basic-dropdown-wormhole
  .boxel-dropdown__content.ember-basic-dropdown-content {
  z-index: calc(var(--boxel-layer-modal-urgent) + 1);
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 100 700;
  font-display: swap;
  src:
    local('IBM Plex Sans Var'),
    local('IBMPlexSansVar'),
    local('IBM Plex Sans Var Regular'),
    local('IBMPlexSansVar-Regular'),
    url(/18b7029dfa6a14b16d20.woff2) format('woff2');
}
@font-face {
  font-family: 'IBM Plex Sans';
  font-style: italic;
  font-weight: 100 700;
  font-display: swap;
  src:
    local('IBM Plex Sans Var Italic'),
    local('IBMPlexSansVar-Italic'),
    url(/3992764c778b3d10d390.woff2) format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src:
    local('IBM Plex Mono'),
    local('IBMPlexMono'),
    url(/0130dae9b0089c864756.woff2) format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src:
    local('IBM Plex Mono Medium'),
    url(/669efdbf92bc91fd55ff.woff2) format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  src:
    local('IBM Plex Mono SemiBold'),
    url(/02af94711dbd2d18f147.woff2) format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src:
    local('IBM Plex Mono Bold'),
    local('IBMPlexMono-Bold'),
    url(/288dfd74c25939b0e834.woff2) format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-weight: 400;
  font-style: italic;
  font-display: swap;
  src:
    local('IBM Plex Mono Italic'),
    url(/6d169abc2a1e3fca44bf.woff2) format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-weight: 500;
  font-style: italic;
  font-display: swap;
  src:
    local('IBM Plex Mono Medium Italic'),
    url(/274386a7a3871ce7a4f2.woff2) format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-weight: 600;
  font-style: italic;
  font-display: swap;
  src:
    local('IBM Plex Mono SemiBold Italic'),
    url(/a1e17e39fc95ee0d0e10.woff2) format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-weight: 700;
  font-style: italic;
  font-display: swap;
  src:
    local('IBM Plex Mono Bold Italic'),
    url(/f4e223947d8f36f19eb4.woff2) format('woff2');
}
@font-face {
  font-family: 'IBM Plex Serif';
  font-weight: 400;
  font-style: normal;
  font-display: swap;
  src:
    local('IBM Plex Serif'),
    local('IBM Plex Serif Regular'),
    local('IBMPlexSerif'),
    local('IBMPlexSerif-Regular'),
    url(/f6e787847c793e474fe9.woff2) format('woff2');
}
@font-face {
  font-family: 'IBM Plex Serif';
  font-weight: 500;
  font-style: normal;
  font-display: swap;
  src:
    local('IBM Plex Serif Medium'),
    local('IBMPlexSerif-Medium'),
    url(/eedb79a45685bac4b47b.woff2) format('woff2');
}
@font-face {
  font-family: 'IBM Plex Serif';
  font-weight: 600;
  font-style: normal;
  font-display: swap;
  src:
    local('IBM Plex Serif SemiBold'),
    local('IBMPlexSerif-SemiBold'),
    url(/39609efbb168aee054f5.woff2) format('woff2');
}
@font-face {
  font-family: 'IBM Plex Serif';
  font-weight: 700;
  font-style: normal;
  font-display: swap;
  src:
    local('IBM Plex Serif Bold'),
    local('IBMPlexSerif-Bold'),
    url(/a0858acb7764230f975b.woff2) format('woff2');
}
@font-face {
  font-family: 'IBM Plex Serif';
  font-weight: 400;
  font-style: italic;
  font-display: swap;
  src:
    local('IBM Plex Serif Italic'),
    local('IBMPlexSerif-Italic'),
    url(/af485895856b5b992051.woff2) format('woff2');
}
@font-face {
  font-family: 'IBM Plex Serif';
  font-weight: 500;
  font-style: italic;
  font-display: swap;
  src:
    local('IBM Plex Serif Medium Italic'),
    local('IBMPlexSerif-MediumItalic'),
    url(/e058527bc7f76339d3cf.woff2) format('woff2');
}
@font-face {
  font-family: 'IBM Plex Serif';
  font-weight: 600;
  font-style: italic;
  font-display: swap;
  src:
    local('IBM Plex Serif SemiBold Italic'),
    local('IBMPlexSerif-SemiBoldItalic'),
    url(/1d5b7656a68cca5eeefb.woff2) format('woff2');
}
@font-face {
  font-family: 'IBM Plex Serif';
  font-weight: 700;
  font-style: italic;
  font-display: swap;
  src:
    local('IBM Plex Serif Bold Italic'),
    local('IBMPlexSerif-BoldItalic'),
    url(/5a91b1e51ff0ae9b5b44.woff2) format('woff2');
}

:root {
  /* internal variables used for base scaling defaults - do not override */
  --_boxel-font-size: 1rem; /* 16px */
  --_boxel-spacing: 1rem; /* 16px */
  --_boxel-radius: 0.625rem; /* 10px */
  --_boxel-sp-unit: 0.25rem; /* 4px */
  /* end of internal variables */

  /* boxel base variable defaults  */
  --boxel-font-size: var(--_boxel-font-size);
  --boxel-spacing: var(--_boxel-spacing);
  --boxel-radius: var(--_boxel-radius);

  /* font-family */
  --boxel-font-family: 'IBM Plex Sans', 'Helvetica Neue', Arial, sans-serif;
  --boxel-serif-font-family: 'IBM Plex Serif', 'Georgia', Times, serif;
  --boxel-monospace-font-family:
    'IBM Plex Mono', 'Menlo', 'Courier New', Courier, monospace;

  /* font size range -- note: see semantic names on line 248 */
  --boxel-font-size-2xl: calc(var(--boxel-font-size) * 2.25); /* 36px */
  --boxel-font-size-xl: calc(var(--boxel-font-size) * 2); /* 32px */
  --boxel-font-size-lg: calc(var(--boxel-font-size) * 1.375); /* 22px */
  --boxel-font-size-md: calc(var(--boxel-font-size) * 1.25); /* 20px */
  /* --boxel-font-size: 16px; (base - declared on line 10) */
  --boxel-font-size-sm: calc(var(--boxel-font-size) * 0.875); /* 14px */
  --boxel-font-size-xs: calc(var(--boxel-font-size) * 0.75); /* 12px */
  --boxel-font-size-2xs: calc(var(--boxel-font-size) * 0.6875); /* 11px */

  /* font shorthand -- note: see semantic names on line 248 */
  --boxel-font-xl: var(--boxel-font-size-xl) / calc(43 / 32)
    var(--boxel-font-family);
  --boxel-font-lg: var(--boxel-font-size-lg) / calc(30 / 22)
    var(--boxel-font-family);
  --boxel-font-md: var(--boxel-font-size-md) / calc(28 / 20)
    var(--boxel-font-family);
  --boxel-font: var(--boxel-font-size) / calc(22 / 16) var(--boxel-font-family);
  --boxel-font-sm: var(--boxel-font-size-sm) / calc(18 / 13)
    var(--boxel-font-family); /* default */
  --boxel-font-xs: var(--boxel-font-size-xs) / calc(15 / 11)
    var(--boxel-font-family);

  /* line-height for corresponding font-size */
  --boxel-line-height-xl: calc(43 / 32); /* 1.34375 */
  --boxel-line-height-lg: calc(30 / 22); /* 1.3636 */
  --boxel-line-height-md: calc(28 / 20); /* 1.4 */
  --boxel-line-height: calc(22 / 16); /* 1.375 */
  --boxel-line-height-sm: calc(18 / 13); /* 1.3846 (body) */
  --boxel-line-height-xs: calc(15 / 11); /* 1.3636 */

  /* letter-spacing */
  /* Note: the px conversion is using default font_size = 16px (1rem) */
  /* Formula: px = em * font_size */
  --boxel-lsp-xxl: 0.1em; /* 1.6px */
  --boxel-lsp-xl: 0.05em; /* 0.8px */
  --boxel-lsp-lg: 0.035em; /* 0.56px */
  --boxel-lsp: 0.025em; /* 0.4px */
  --boxel-lsp-sm: 0.015em; /* 0.24px */
  --boxel-lsp-xs: 0.01em; /* 0.16px */
  --boxel-lsp-xxs: 0.005em; /* 0.08px */

  /* Modular scale for spacing */
  --boxel-ratio: 1.333; /* scale (based on "Perfect Fourth" scale) */
  --boxel-sp-6xs: calc(var(--boxel-sp-5xs) / var(--boxel-ratio)); /* 2.14px */
  --boxel-sp-5xs: calc(var(--boxel-sp-4xs) / var(--boxel-ratio)); /* 2.86px */
  --boxel-sp-4xs: calc(var(--boxel-sp-3xs) / var(--boxel-ratio)); /* 3.57px */
  --boxel-sp-3xs: calc(var(--boxel-sp-2xs) / var(--boxel-ratio)); /* 4.76px */
  --boxel-sp-2xs: calc(var(--boxel-sp-xs) / var(--boxel-ratio)); /* 6.75px */
  --boxel-sp-xs: calc(var(--boxel-sp-sm) / var(--boxel-ratio)); /* 9px */
  --boxel-sp-sm: calc(var(--boxel-sp) / var(--boxel-ratio)); /* 12px */
  --boxel-sp: var(--boxel-spacing); /* 16px */
  --boxel-sp-lg: calc(var(--boxel-sp) * var(--boxel-ratio)); /* 21.33px */
  --boxel-sp-xl: calc(var(--boxel-sp-lg) * var(--boxel-ratio)); /* 28.44px */
  --boxel-sp-2xl: calc(var(--boxel-sp-xl) * var(--boxel-ratio)); /* 37.92px */
  --boxel-sp-3xl: calc(var(--boxel-sp-2xl) * var(--boxel-ratio)); /* 50.56px */
  --boxel-sp-4xl: calc(var(--boxel-sp-3xl) * var(--boxel-ratio)); /* 67.41px */
  --boxel-sp-5xl: calc(var(--boxel-sp-4xl) * var(--boxel-ratio)); /* 89.88px */
  --boxel-sp-6xl: calc(var(--boxel-sp-5xl) * var(--boxel-ratio)); /* 119.84px */

  /* common icon sizes */
  --boxel-icon-xxs: 0.75rem; /* 12px */
  --boxel-icon-xs: 1rem; /* 16px */
  --boxel-icon-sm: 1.25rem; /* 20px */
  --boxel-icon-med: 1.875rem; /* 30px */
  --boxel-icon-lg: 2.5rem; /* 40px */
  --boxel-icon-xl: 3.75rem; /* 60px */
  --boxel-icon-xxl: 5rem; /* 80px */

  /* button sizes */
  --boxel-button-mini: 1.25rem; /* 20px */
  --boxel-button-xs: 1.5rem; /* 24px */
  --boxel-button-sm: 1.875rem; /* 30px - base */
  --boxel-button-tall: 2.5rem; /* 40px */
  --boxel-button-touch: 3rem; /* 48px */

  /* border-color */
  --boxel-border-color: #d3d3d3;
  --boxel-button-border-color: #acacac;

  /* border */
  --boxel-border: 1px solid var(--boxel-border-color);
  --boxel-border-dark: 1px solid var(--boxel-dark);
  --boxel-border-flexible: 1px solid rgba(255, 255, 255, 0.35);
  --boxel-border-card: 1px solid rgba(0, 0, 0, 0.1);

  /* border-radius */
  --boxel-border-radius-xxs: calc(
    var(--boxel-border-radius-xs) - 2.5px
  ); /* 1.5px */
  --boxel-border-radius-xs: calc(var(--boxel-border-radius-sm) - 2px); /* 4px */
  --boxel-border-radius-sm: calc(var(--boxel-border-radius) - 4px); /* 6px */
  --boxel-border-radius: var(--boxel-radius); /* 10px - base */
  --boxel-border-radius-lg: calc(var(--boxel-border-radius) + 2px); /* 12px */
  --boxel-border-radius-xl: calc(
    var(--boxel-border-radius-lg) + 3px
  ); /* 15px */
  --boxel-border-radius-xxl: calc(
    var(--boxel-border-radius-xl) + 5px
  ); /* 20px */

  /* animations */
  --boxel-infinite-spin-animation: boxel-spin 6000ms linear infinite;

  /* transition */
  --boxel-transition: 0.2s ease;
  --boxel-transition-properties:
    color var(--boxel-transition), background-color var(--boxel-transition),
    border-color var(--boxel-transition), box-shadow var(--boxel-transition),
    filter var(--boxel-transition); /* for commonly used properties */

  /* box-shadow */
  --boxel-box-shadow: 0 1px 3px rgb(0 0 0 / 25%);
  --boxel-box-shadow-hover: 0 3px 10px rgb(0 0 0 / 15%);
  --boxel-deep-box-shadow: 0 5px 15px 0 rgba(0 0 0 / 50%);

  /* outline */
  --boxel-outline-width: 2px;
  --boxel-outline-color: var(--boxel-blue);
  --boxel-outline-style: solid;
  --boxel-outline: var(--boxel-outline-width) var(--boxel-outline-style)
    var(--boxel-outline-color);

  /* Container sizes */
  --boxel-xxs-container: 15.625rem; /* 250px */
  --boxel-xs-container: 17.8125rem; /* 285px */
  --boxel-sm-container: 36.25rem; /* 580px */
  --boxel-md-container: 40.625rem; /* 650px */
  --boxel-lg-container: 43.75rem; /* 700px */
  --boxel-xl-container: 65rem; /* 1040px */
  --boxel-xxl-container: 83.76rem; /* 1340px */

  /* COLOR PALETTE */

  /**** Revisited Colors BOXEL-UI ****/
  --boxel-50: #f5f5f5;
  --boxel-100: #f8f7fa;
  --boxel-200: #e8e8e8;
  --boxel-300: #d1d1d1;
  --boxel-400: #afafb7;
  --boxel-450: #919191;
  --boxel-500: #5a586a;
  --boxel-550: #525252;
  --boxel-600: #413e4e;
  --boxel-650: #3b394b;
  --boxel-700: #272330;

  --boxel-cyan: #00ebe5;
  --boxel-teal: #00ffba;
  --boxel-dark-teal: #00ebac;
  --boxel-red: #ff5050;
  --boxel-pink: #ff009d;
  --boxel-orange: #ff7f00;
  --boxel-yellow: #ffd800;
  --boxel-lime: #c3fc33;
  --boxel-green: #37eb77;
  --boxel-dark-green: #00ac3d;
  --boxel-lilac: #a66dfa;
  --boxel-fuschia: #ac00ff;
  --boxel-purple: #6638ff;
  --boxel-blue: #0069f9;
  --boxel-navy: #281e78;

  --boxel-label-color: currentColor;
  /**** End of revisited colors ****/

  /* Primary colors */
  --boxel-light: #fff;
  --boxel-dark: #000;
  --boxel-dark-hover: rgba(0, 0, 0, 0.1);
  --boxel-darker-hover: rgba(0, 0, 0, 0.5);

  --boxel-highlight: var(--boxel-teal);
  --boxel-highlight-hover: var(--boxel-dark-teal);
  --boxel-danger: var(
    --boxel-red
  ); /* formerly boxel-error-100: the latest design docs (8/16/2023) use this color for danger instead */
  --boxel-danger-hover: #fa1521;

  /* Boxel purples */
  --boxel-purple-100: var(--boxel-100);
  --boxel-purple-200: var(--boxel-400); /* formerly: #b3b1b8; */
  --boxel-purple-300: var(--boxel-400);
  --boxel-purple-400: var(--boxel-500); /* formerly: #6b6a80; */
  --boxel-purple-500: var(--boxel-500);
  --boxel-purple-600: var(--boxel-600); /* Cardspace bg */
  --boxel-purple-700: var(--boxel-700); /* formerly: #393642; */
  --boxel-purple-750: var(--boxel-700); /* formerly: #363441; */
  --boxel-purple-800: var(--boxel-700); /* formerly: #2e2d38; */
  --boxel-purple-900: var(--boxel-700); /* Card Wallet bg */

  /* Boxel neutrals */
  --boxel-light-100: #f4f4f4;
  --boxel-light-200: var(--boxel-200); /* formerly: #f0f0f0; */
  --boxel-light-300: var(--boxel-200); /* formerly: #efefef; */
  --boxel-light-400: var(--boxel-200);
  --boxel-light-500: var(--boxel-300); /* formerly: #dedede; */
  --boxel-light-600: var(--boxel-300);

  /* Status colors */
  --boxel-error-100: #dc0202; /* alert - attention - error */
  --boxel-error-200: #ed0000;
  --boxel-error-300: #ff0000;
  --boxel-error-400: #ff5050;
  --boxel-warning-100: var(--boxel-yellow); /* warning - notification */
  --boxel-warning-200: #ffba00;
  --boxel-success-100: var(--boxel-green);
  --boxel-success-200: var(--boxel-teal);
  --boxel-success-300: var(--boxel-dark-green);

  /* z-index layers */
  --boxel-layer-floating-button: 1000;
  --boxel-layer-modal-default: 1500;
  --boxel-layer-modal-urgent: 2000;

  /* Form control appearance */
  --boxel-form-control-height: 2.5rem; /* 40px */
  --boxel-form-control-placeholder-color: var(--boxel-400);
  --boxel-form-control-border-color: var(--boxel-border-color);
  --boxel-form-control-border-radius: var(--boxel-border-radius);
  --boxel-form-control-dark-mode-placeholder-color: #acacac;
  --boxel-form-control-dark-mode-border: var(--boxel-border-flexible);

  /* deprecated */
  --boxel-sp-xxxl: var(--boxel-sp-3xl); /* xxxl is deprecated, use 3xl */
  --boxel-sp-xxl: var(--boxel-sp-2xl); /* xxl is deprecated, use 2xl */
  --boxel-sp-xxs: var(--boxel-sp-2xs); /* xxs is deprecated, use 2xs */
  --boxel-sp-xxxs: var(--boxel-sp-3xs); /* xxxs is deprecated, use 3xs */
}

/** Semantic CSS Variables for General Use */
:root {
  /* font-family */
  --boxel-body-font-family: var(--boxel-font-family);
  --boxel-heading-font-family: var(--boxel-font-family);
  --boxel-section-heading-font-family: var(--boxel-font-family);
  --boxel-subheading-font-family: var(--boxel-font-family);
  --boxel-caption-font-family: var(--boxel-font-family);

  /* font-size */
  --boxel-heading-font-size: var(--boxel-font-size-lg); /* 22px */
  --boxel-section-heading-font-size: var(--boxel-font-size-md); /* 18px */
  --boxel-subheading-font-size: var(--boxel-font-size); /* 16px */
  --boxel-body-font-size: var(--boxel-font-size-sm); /* 14px */
  --boxel-caption-font-size: var(--boxel-font-size-xs); /* 12px */

  /* line-height */
  --boxel-body-line-height: var(--boxel-line-height-sm);
  --boxel-heading-line-height: var(--boxel-line-height-lg);
  --boxel-caption-line-height: var(--boxel-line-height-xs);
  --boxel-section-heading-line-height: var(--boxel-line-height-md);
  --boxel-subheading-line-height: var(--boxel-line-height);

  /* font-weight */
  --boxel-heading-font-weight: 700;
  --boxel-section-heading-font-weight: 500;
  --boxel-subheading-font-weight: 500;
  --boxel-body-font-weight: 400;
  --boxel-caption-font-weight: 500;
}


  @layer boxelComponentL1 {
    .boxel-accordion-item[data-scopedcss-a1913ac428-5bcd0742a2] {
      min-height: var(
        --boxel-accordion-item-min-height,
        var(--boxel-form-control-height)
      );
      padding-inline: var(--boxel-accordion-item-padding-inline, 0);
      padding-block: var(--boxel-accordion-item-padding-block, 2px);
    }
    .boxel-accordion-item[data-scopedcss-a1913ac428-5bcd0742a2]:not(:first-child) {
      border-top: var(
        --boxel-accordion-item-border,
        var(
          --accordion-border,
          1px solid var(--border, var(--boxel-border-color))
        )
      );
    }

    .boxel-accordion-item-title[data-scopedcss-a1913ac428-5bcd0742a2] {
      margin: 0;
      font-size: var(--boxel-accordion-title-font-size, inherit);
      font-weight: var(--boxel-accordion-title-font-weight, 700);
      line-height: inherit;
      letter-spacing: inherit;
    }

    .boxel-accordion-item-trigger[data-scopedcss-a1913ac428-5bcd0742a2] {
      display: inline-flex;
      align-items: center;
      gap: var(--boxel-sp-xxs);
      width: 100%;
      max-width: 100%;
      padding-block: var(
        --boxel-accordion-trigger-padding-block,
        var(--boxel-sp-xs)
      );
      padding-inline: var(--boxel-accordion-trigger-padding-inline, 0);
      color: inherit;
      background-color: transparent;
      border: none;
      text-align: start;
    }
    .boxel-accordion-item-trigger[data-scopedcss-a1913ac428-5bcd0742a2]:focus-visible {
      outline-color: var(--ring, var(--boxel-highlight));
    }
    .boxel-accordion-item-trigger[data-scopedcss-a1913ac428-5bcd0742a2]:hover:not(:disabled) {
      cursor: pointer;
    }
    .boxel-accordion-item-trigger[data-scopedcss-a1913ac428-5bcd0742a2]:disabled {
      opacity: 0.5;
    }

    .boxel-accordion-item-icon[data-scopedcss-a1913ac428-5bcd0742a2] {
      flex-shrink: 0;
    }
    [aria-expanded] .boxel-accordion-item-icon[data-scopedcss-a1913ac428-5bcd0742a2] {
      transform: rotate(90deg);
    }

    .boxel-accordion-item-content[data-scopedcss-a1913ac428-5bcd0742a2] {
      display: grid;
      grid-template-rows: 0fr;
    }
    .boxel-accordion-item-content[data-state='open'][data-scopedcss-a1913ac428-5bcd0742a2] {
      grid-template-rows: 1fr;
    }
    .boxel-accordion-item-content-inner[data-scopedcss-a1913ac428-5bcd0742a2] {
      overflow: hidden;
    }

    @media (prefers-reduced-motion: no-preference) {
      .boxel-accordion-item[data-scopedcss-a1913ac428-5bcd0742a2] {
        --_bai-transition: var(--boxel-accordion-transition, 200ms ease-out);
      }

      .boxel-accordion-item-icon[data-scopedcss-a1913ac428-5bcd0742a2] {
        transition: transform var(--_bai-transition);
      }

      .boxel-accordion-item-content[data-scopedcss-a1913ac428-5bcd0742a2] {
        transition: grid-template-rows var(--_bai-transition);
      }
      .boxel-accordion-item-content-inner[data-scopedcss-a1913ac428-5bcd0742a2] {
        transition: opacity var(--_bai-transition);
        opacity: 0;
      }
      .boxel-accordion-item-content[data-state='open']
        .boxel-accordion-item-content-inner[data-scopedcss-a1913ac428-5bcd0742a2] {
        opacity: 1;
      }
    }
  }


  @layer boxelComponentL1 {
    .boxel-accordion[data-scopedcss-eff2ac9e86-b85c13630c] {
      --accordion-border: var(
        --boxel-accordion-border,
        1px solid var(--border, var(--boxel-border-color))
      );

      display: flex;
      flex-direction: column;
    }
    .boxel-accordion-container[data-scopedcss-eff2ac9e86-b85c13630c] {
      --boxel-accordion-item-padding-inline: var(--boxel-sp-xxs);
      --boxel-accordion-item-padding-block: var(--boxel-sp-xxxs);

      border: var(--accordion-border);
      border-radius: var(--radius, var(--boxel-border-radius));
    }
  }


  /* zero specificity default sizing */
  [data-scopedcss-a19aad2e8a-66eafa962a]:where(.boxel-loading-indicator) {
    --loading-indicator-size: var(
      --boxel-loading-indicator-size,
      var(--boxel-icon-sm)
    );
    display: inline-block;
    width: var(--loading-indicator-size);
    height: var(--loading-indicator-size);
    flex-shrink: 0;
  }

  .variant-default[data-scopedcss-a19aad2e8a-66eafa962a] {
    --loading-indicator-color: var(--foreground);
  }

  .variant-primary[data-scopedcss-a19aad2e8a-66eafa962a] {
    --loading-indicator-color: var(--primary-foreground);
  }

  .variant-secondary[data-scopedcss-a19aad2e8a-66eafa962a] {
    --loading-indicator-color: var(--secondary-foreground);
  }

  .variant-muted[data-scopedcss-a19aad2e8a-66eafa962a] {
    --loading-indicator-color: var(--muted-foreground);
  }

  .variant-destructive[data-scopedcss-a19aad2e8a-66eafa962a] {
    --loading-indicator-color: var(--destructive-foreground);
  }

  /*
    Only animate if the user has not said that they want reduced motion
  */
  @media (prefers-reduced-motion: no-preference) {
    .boxel-loading-indicator[data-scopedcss-a19aad2e8a-66eafa962a] svg {
      animation: var(--boxel-infinite-spin-animation);
      width: var(--loading-indicator-size);
      height: var(--loading-indicator-size);
    }
  }


  @layer boxelComponentL1 {
    /* Button */
    .boxel-button[data-scopedcss-ac55ae0c77-fbd43117c3] {
      --boxel-loading-indicator-size: var(
        --boxel-button-loading-icon-size,
        var(--boxel-icon-xs)
      );

      display: inline-flex;
      justify-content: center;
      height: min-content;
      align-items: center;
      border-radius: var(
        --boxel-button-border-radius,
        var(--radius, var(--boxel-border-radius))
      );
      transition: var(
        --boxel-button-transition,
        var(--boxel-transition-properties)
      );

      /* kind variants + disabled state */
      border: var(--boxel-button-border, none);
      color: var(--boxel-button-text-color);
      background-color: var(--boxel-button-color);

      /* size variants */
      font: var(--boxel-button-font, 700 var(--boxel-font-sm));
      font-family: inherit;
      min-height: var(--boxel-button-min-height);
      min-width: var(--boxel-button-min-width);
      padding: var(--boxel-button-padding);
      letter-spacing: var(--boxel-button-letter-spacing, var(--boxel-lsp));
      box-shadow: var(--boxel-button-box-shadow);
    }
    .boxel-button[data-scopedcss-ac55ae0c77-fbd43117c3]:not(.rectangular) {
      border-radius: var(--boxel-button-border-radius, 100px);
    }
    .boxel-button[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):hover {
      background-color: color-mix(
        in oklab,
        var(--boxel-button-color) 90%,
        transparent
      );
    }
    .boxel-button[data-scopedcss-ac55ae0c77-fbd43117c3]:focus-visible {
      outline-color: var(--ring, var(--boxel-highlight));
      outline-offset: 2px;
    }

    .loading-indicator[data-scopedcss-ac55ae0c77-fbd43117c3] {
      margin-right: var(
        --boxel-button-loading-indicator-gap,
        var(--boxel-sp-xxs)
      );
    }

    /* select disabled buttons and links that don't have href */

    /*
      a.disabled-link is a special case for an automatically appended class by the LinkTo component
      the LinkTo component appends the href regardless, so we have to select it in other ways.
      Removing the chained classes will make kind-variants overwrite the disabled style on the LinkTo (specificity issues)
    */
    .boxel-button[data-scopedcss-ac55ae0c77-fbd43117c3]:disabled,
    a.boxel-button[data-scopedcss-ac55ae0c77-fbd43117c3]:not([href]),
    a.boxel-button[href=''][data-scopedcss-ac55ae0c77-fbd43117c3],
    a.boxel-button.disabled-link[data-scopedcss-ac55ae0c77-fbd43117c3] {
      --boxel-button-color: var(--boxel-border-color);
      --boxel-button-border: 1px solid var(--boxel-button-color);
      --boxel-button-text-color: var(--boxel-450);
      --boxel-button-box-shadow: none;

      cursor: default;
    }

    /* the a element does not have a disabled attribute. Clicking will still trigger event listeners */
    a.boxel-button[data-scopedcss-ac55ae0c77-fbd43117c3]:not([href]),
    a.boxel-button[href=''][data-scopedcss-ac55ae0c77-fbd43117c3],
    a.boxel-button.disabled-link[data-scopedcss-ac55ae0c77-fbd43117c3] {
      pointer-events: none;
    }

    /*
      loading state.
      this should only be relevant for buttons - links shouldn't need it.
      We want to preserve the "normal" styling of the button but not allow interaction
    */
    .loading[data-scopedcss-ac55ae0c77-fbd43117c3] {
      pointer-events: none;
    }

    /* overwrite the global style for links in global.css */
    a.boxel-button[data-scopedcss-ac55ae0c77-fbd43117c3]:hover {
      color: var(--boxel-button-text-color);
    }

    /**
    * Kind variants - variants that control the colors on a button
    *
    * The @kind argument on the button component should create a corresponding class with format
    * kind-@kind
    *
    * Classes for the @kind argument can control the following properties:
    *
    * --boxel-button-color (css "background-color" property)
    * --boxel-button-border (css shorthand "border" property)
    * --boxel-button-text-color (css "color" property)
    *
    */
    .kind-default[data-scopedcss-ac55ae0c77-fbd43117c3] {
      --boxel-button-color: var(--background, var(--boxel-light));
      --boxel-button-text-color: var(--foreground, var(--boxel-dark));
      --boxel-button-border: 1px solid var(--border, var(--boxel-400));
    }
    .kind-default[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):hover,
    .kind-default[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):active {
      --boxel-button-color: var(--accent, var(--boxel-light));
      --boxel-button-text-color: var(--accent-foreground, var(--boxel-dark));
      --boxel-button-border: 1px solid var(--border, var(--boxel-dark));
    }

    .kind-primary[data-scopedcss-ac55ae0c77-fbd43117c3] {
      --boxel-button-color: var(--primary, var(--boxel-highlight));
      --boxel-button-text-color: var(--primary-foreground, var(--boxel-dark));
    }
    .kind-primary[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):hover,
    .kind-primary[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):active {
      --boxel-button-color: var(--primary, var(--boxel-highlight-hover));
    }

    .kind-secondary[data-scopedcss-ac55ae0c77-fbd43117c3] {
      --boxel-button-color: var(--secondary, var(--boxel-light));
      --boxel-button-text-color: var(
        --secondary-foreground,
        var(--boxel-dark)
      );
      --boxel-button-border: 1px solid
        var(--secondary, var(--boxel-button-border-color));
    }
    .kind-secondary[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):hover,
    .kind-secondary[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):active {
      --boxel-button-border: 1px solid var(--secondary, var(--boxel-dark));
    }

    .kind-muted[data-scopedcss-ac55ae0c77-fbd43117c3] {
      --boxel-button-color: var(--muted, var(--boxel-100));
      --boxel-button-text-color: var(--muted-foreground, var(--boxel-dark));
    }
    .kind-muted[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):hover {
      background-color: color-mix(
        in oklab,
        var(--muted, var(--boxel-100)) 96%,
        var(--muted-foreground, var(--boxel-dark))
      );
    }

    .kind-destructive[data-scopedcss-ac55ae0c77-fbd43117c3],
    .kind-danger[data-scopedcss-ac55ae0c77-fbd43117c3] {
      --boxel-button-color: var(--destructive, var(--boxel-danger));
      --boxel-button-text-color: var(
        --destructive-foreground,
        var(--boxel-light-100)
      );
    }
    .kind-destructive[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):hover,
    .kind-destructive[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):active,
    .kind-danger[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):hover,
    .kind-danger[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):active {
      --boxel-button-color: var(--destructive, var(--boxel-danger-hover));
    }

    .kind-text-only[data-scopedcss-ac55ae0c77-fbd43117c3] {
      /* transparent background and border */
      --boxel-button-color: transparent;
      --boxel-button-text-color: inherit;
    }
    .kind-text-only[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):hover,
    .kind-text-only[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):active {
      --boxel-button-color: var(
        --accent,
        color-mix(in oklab, currentColor 10%, transparent)
      );
      --boxel-button-text-color: var(--accent-foreground, currentColor);
    }

    .kind-primary-dark[data-scopedcss-ac55ae0c77-fbd43117c3] {
      /* inverted background and foreground */
      --boxel-button-color: var(--foreground, var(--boxel-dark));
      --boxel-button-text-color: var(--background, var(--boxel-light));
    }
    .kind-primary-dark[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):hover,
    .kind-primary-dark[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):active {
      --boxel-button-color: color-mix(
        in oklab,
        var(--foreground, var(--boxel-dark)) 85%,
        transparent
      );
    }

    .kind-secondary-light[data-scopedcss-ac55ae0c77-fbd43117c3] {
      /* transparent on light background */
      --boxel-button-color: transparent;
      --boxel-button-text-color: var(--foreground, var(--boxel-dark));
      --boxel-button-border: 1px solid
        var(--border, var(--boxel-button-border-color));
    }
    .kind-secondary-dark[data-scopedcss-ac55ae0c77-fbd43117c3] {
      /* transparent on dark background */
      --boxel-button-color: transparent;
      --boxel-button-text-color: var(--background, var(--boxel-light));
      --boxel-button-border: 1px solid
        var(--border, var(--boxel-button-border-color));
    }
    .kind-secondary-light[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):hover,
    .kind-secondary-light[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):active,
    .kind-secondary-dark[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):hover,
    .kind-secondary-dark[data-scopedcss-ac55ae0c77-fbd43117c3]:not(:disabled):active {
      --boxel-button-border: 1px solid var(--boxel-button-text-color);
    }

    /**
    * Size variants - variants that control the size and spacing of a button
    *
    * The @size argument on the button component should create a corresponding class with format
    * size-@size
    *
    * Classes for the @size argument can control the following properties:
    *
    * --boxel-button-padding
    * --boxel-button-min-width
    * --boxel-button-min-height
    * --boxel-button-font
    * --boxel-button-letter-spacing
    * --boxel-loading-indicator-size
    *
    */

    .size-extra-small[data-scopedcss-ac55ae0c77-fbd43117c3] {
      --boxel-button-padding: var(--boxel-sp-5xs) var(--boxel-sp-xs);
      --boxel-button-min-height: var(--boxel-button-xs);
      --boxel-button-min-width: 5rem;
      --boxel-button-loading-icon-size: var(--boxel-icon-xxs);
      --boxel-button-font: 700 var(--boxel-font-xs);
      --boxel-button-letter-spacing: var(--boxel-lsp-lg);
    }
    .size-extra-small.rectangular[data-scopedcss-ac55ae0c77-fbd43117c3] {
      border-radius: var(--boxel-border-radius-sm);
    }

    .size-small[data-scopedcss-ac55ae0c77-fbd43117c3] {
      --boxel-button-padding: var(--boxel-sp-4xs) var(--boxel-sp-sm);
      --boxel-button-min-height: var(--boxel-button-sm);
      --boxel-button-min-width: 5rem;
    }
    .size-small.rectangular[data-scopedcss-ac55ae0c77-fbd43117c3] {
      border-radius: var(--boxel-border-radius-sm);
    }

    .size-base[data-scopedcss-ac55ae0c77-fbd43117c3] {
      --boxel-button-padding: var(--boxel-sp-4xs) var(--boxel-sp-xl);
      --boxel-button-min-height: var(--boxel-button-sm);
      --boxel-button-min-width: 5rem;
    }

    /* tall but thinner button */
    .size-tall[data-scopedcss-ac55ae0c77-fbd43117c3] {
      --boxel-button-padding: var(--boxel-sp-xxs) var(--boxel-sp-lg);
      --boxel-button-min-height: var(--boxel-button-tall);
      --boxel-button-min-width: 5rem;
    }

    /*
      extra tall button mainly used in mobile screens
      touchable as it's bigger
      */
    .size-touch[data-scopedcss-ac55ae0c77-fbd43117c3] {
      --boxel-button-padding: var(--boxel-sp-xs) var(--boxel-sp-lg);
      --boxel-button-min-height: var(--boxel-button-touch);
      --boxel-button-min-width: 5rem;
      --boxel-button-loading-icon-size: var(--boxel-icon-sm);
      --boxel-button-font: 700 var(--boxel-font);
      --boxel-button-letter-spacing: var(--boxel-lsp-xs);
    }

    /* auto size properties & smallest padding size */
    .size-auto[data-scopedcss-ac55ae0c77-fbd43117c3] {
      --boxel-button-padding: 2px;
    }
  }


  @layer boxelComponentL2 {
    .boxel-icon-button[data-scopedcss-116b628f06-aea1b15db4] {
      --icon-color: var(--boxel-icon-button-color, currentColor);
      width: var(--boxel-icon-button-width, var(--boxel-icon-lg));
      height: var(--boxel-icon-button-height, var(--boxel-icon-lg));
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      padding: var(--boxel-icon-button-padding, 0);
      background-color: var(
        --boxel-icon-button-background,
        var(--boxel-button-color, transparent)
      );
      border: none;
      border-radius: var(--boxel-border-radius);
      color: var(
        --boxel-icon-button-color,
        var(--boxel-button-text-color, inherit)
      );
      z-index: 0;
      overflow: hidden;
    }
    .boxel-icon-button--extra-small[data-scopedcss-116b628f06-aea1b15db4] {
      width: var(--boxel-button-mini);
      height: var(--boxel-button-mini);
      border-radius: var(--boxel-border-radius-xs);
    }
    .boxel-icon-button--small[data-scopedcss-116b628f06-aea1b15db4] {
      width: var(--boxel-button-xs);
      height: var(--boxel-button-xs);
      border-radius: var(--boxel-border-radius-xs);
    }
    .boxel-icon-button--base[data-scopedcss-116b628f06-aea1b15db4] {
      width: var(--boxel-button-sm);
      height: var(--boxel-button-sm);
      border-radius: var(--boxel-border-radius-sm);
    }
    .boxel-icon-button--tall[data-scopedcss-116b628f06-aea1b15db4] {
      padding: var(--boxel-sp-xxs);
      width: var(--boxel-button-tall);
      height: var(--boxel-button-tall);
    }
    .boxel-icon-button--touch[data-scopedcss-116b628f06-aea1b15db4] {
      padding: var(--boxel-sp-xs);
      width: var(--boxel-button-touch);
      height: var(--boxel-button-touch);
    }
    .is-round[data-scopedcss-116b628f06-aea1b15db4] {
      border-radius: 50%;
    }

    .kind-default[data-scopedcss-116b628f06-aea1b15db4] {
      background: var(--boxel-icon-button-background, none);
      color: var(--boxel-icon-button-color, inherit);
    }
    .kind-default[data-scopedcss-116b628f06-aea1b15db4]:disabled {
      color: var(--boxel-400);
    }

    .kind-primary-dark[data-scopedcss-116b628f06-aea1b15db4]:not(:disabled) {
      --boxel-button-color: var(--primary-foreground, var(--boxel-700));
      --boxel-button-text-color: var(--primary, var(--boxel-highlight));
    }
    .kind-primary-dark[data-scopedcss-116b628f06-aea1b15db4]:not(:disabled):hover {
      --boxel-button-color: color-mix(
        in oklab,
        var(--primary-foreground, var(--boxel-700)) 85%,
        transparent
      );
    }

    @media (prefers-reduced-motion: no-preference) {
      .loading-icon[data-scopedcss-116b628f06-aea1b15db4] {
        animation: var(--boxel-infinite-spin-animation);
      }
    }
  }


  .boxel-add-button[data-scopedcss-6d0edf99bb-1c9d82a357] {
    --boxel-icon-button-background: var(--background, var(--boxel-100));
    --boxel-icon-button-color: var(--foreground, var(--boxel-dark));
    --icon-color: var(--boxel-icon-button-color);
    border-radius: 50%;
    border: 1px solid var(--border);
    box-shadow: var(--shadow, 0 4px 6px 0px rgb(0 0 0 / 35%));
  }
  .boxel-add-button[data-scopedcss-6d0edf99bb-1c9d82a357]:not(:disabled):hover {
    --boxel-icon-button-background: var(--accent, var(--boxel-200));
    --boxel-icon-button-color: var(--accent-foreground, var(--boxel-dark));
  }


  .alert[data-scopedcss-c6618362db-275df79f82] {
    display: flex;
    gap: var(--boxel-sp-xs);
  }
  .alert + .alert[data-scopedcss-c6618362db-275df79f82] {
    margin-top: var(--boxel-sp-lg);
  }
  .alert-icon[data-scopedcss-c6618362db-275df79f82] {
    min-width: 20px;
    height: 20px;
    --icon-background-color: var(--boxel-error-400);
  }
  .failure-icon[data-scopedcss-c6618362db-275df79f82] {
    --icon-background-color: var(--destructive, var(--boxel-error-400));
    --icon-color: var(--destructive-foreground, var(--boxel-light));
  }
  .message[data-scopedcss-c6618362db-275df79f82] {
    align-self: center;
    overflow: hidden;
    word-wrap: break-word;
    overflow-wrap: break-word;
    margin: 0;
  }


  .action-button[data-scopedcss-c6618362db-ed8bedc2c2] {
    --boxel-button-min-width: max-content;
    width: fit-content;
    margin-left: auto;
  }


  .alert-container[data-scopedcss-c6618362db-3ecc3e80e5] {
    display: flex;
    flex-direction: column;
    padding: var(--boxel-sp-sm);
    font: 500 var(--boxel-font-xs);
    letter-spacing: var(--boxel-lsp-sm);
    border-radius: var(--boxel-border-radius-xxl);
  }
  .error-container[data-scopedcss-c6618362db-3ecc3e80e5] {
    background-color: var(--destructive-foreground, var(--boxel-650));
    color: var(--destructive, var(--boxel-light));
  }
  .warning-container[data-scopedcss-c6618362db-3ecc3e80e5] {
    background-color: var(--accent, var(--boxel-warning-200));
    color: var(--accent-foreground, var(--boxel-dark));
  }

  .alert-container[data-scopedcss-c6618362db-3ecc3e80e5] >  * + * {
    margin-top: var(--boxel-sp-sm);
  }


  .profile-icon[data-scopedcss-115c9ef2aa-1b16e38c17] {
    --icon-size: var(--profile-avatar-icon-size, 40px);
    background: var(--profile-avatar-icon-background, var(--boxel-dark));
    background-position: center;
    background-size: cover;
    border-radius: 50%;
    border: var(--profile-avatar-icon-border, 2px solid white);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: var(--icon-size);
    width: var(--icon-size);
    color: var(--profile-avatar-text-color, var(--boxel-light));
    font-size: calc(var(--icon-size) * 0.55);
    letter-spacing: 0;
    line-height: 1;
  }


  @layer boxelComponentL1 {
    .fitted-template {
      width: 100%;
      height: 100%;
      display: flex;
      gap: var(--boxel-sp-xs);
      padding: var(--boxel-sp-xs);
      background-color: var(--card);
      color: var(--card-foreground);
      overflow: hidden;
    }
    .thumbnail-section {
      flex-shrink: 0;
      display: flex;
      justify-content: center;
      align-items: center;
      overflow: hidden;
    }
    .card-thumbnail {
      display: flex;
      align-items: center;
      justify-content: center;
      background-color: var(--boxel-light);
      background-position: center;
      background-size: cover;
      background-repeat: no-repeat;
      border-radius: var(--boxel-border-radius-sm);
      width: 100%;
      height: 100%;
      overflow: hidden;
    }
    .card-thumbnail-placeholder {
      display: flex;
      width: 100%;
      height: 100%;
      background-color: var(--accent, var(--boxel-highlight));
    }
    .card-type-icon {
      aspect-ratio: 1 / 1;
      min-width: 32px;
      min-height: 32px;
      max-height: 52px;
      max-width: 52px;
      width: 100%;
      height: auto;
    }
    .info-section {
      width: 100%;
      overflow: hidden;
    }
    .card-title {
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      overflow: hidden;
      margin-block: 0;
      font-weight: 500;
      font-size: var(--boxel-body-font-size);
      letter-spacing: var(--boxel-lsp-sm);
      line-height: 1.25;
      text-overflow: ellipsis;
    }
    .card-display-name {
      margin-top: var(--boxel-sp-4xs);
      margin-bottom: 0;
      color: var(--muted-foreground, var(--boxel-450));
      font-weight: 500;
      font-size: var(--boxel-caption-font-size);
      line-height: var(--boxel-caption-line-height);
      letter-spacing: var(--boxel-lsp-xs);
      text-overflow: ellipsis;
      white-space: nowrap;
      overflow: hidden;
    }
    .card-description {
      display: -webkit-box;
      -webkit-box-orient: vertical;
      overflow: hidden;
      margin-block: 0;
      font-size: var(--boxel-caption-font-size);
      line-height: var(--boxel-caption-line-height);
      letter-spacing: var(--boxel-lsp-xs);
      text-overflow: ellipsis;
    }

    /* Aspect Ratio <= 1.0 (Vertical) */
    /* Common */
    @container fitted-card ((aspect-ratio <= 1) and (height < 180px)) {
      .card-title {
        font-size: var(--boxel-caption-font-size);
      }
    }

    @container fitted-card (aspect-ratio <= 1.0) {
      .fitted-template {
        flex-direction: column;
      }
      .thumbnail-section {
        width: 100%;
        height: 50cqmin;
      }
      .info-section {
        text-align: center;
      }
    }

    @container fitted-card (aspect-ratio <= 1.0) and (height <= 128px) {
      .thumbnail-section {
        height: 45cqmin;
      }
    }

    @container fitted-card (aspect-ratio <= 1.0) and (width <= 140px) and (height <= 148px) {
      .card-description {
        display: none;
      }
    }

    @container fitted-card (aspect-ratio <= 1.0) and (width <= 100px) and (400px <= height) {
      .card-description {
        -webkit-line-clamp: 15;
      }
    }

    /* Vertical Tiles*/
    /* Small Tile (150 x 170) */
    @container fitted-card (aspect-ratio <= 1.0) and (150px <= width ) and (170px <= height) {
      .thumbnail-section {
        min-height: 70px;
      }
      .card-title {
        -webkit-line-clamp: 2;
      }
      .card-description {
        display: none;
      }
    }
    /* CardsGrid Tile (170 x 250) */
    @container fitted-card (aspect-ratio <= 1.0) and (width = 170px) and (height = 250px) {
      .thumbnail-section {
        height: auto;
        aspect-ratio: 1 / 1;
      }
      .card-title {
        -webkit-line-clamp: 2;
      }
    }
    /* Tall Tile (150 x 275) */
    @container fitted-card (aspect-ratio <= 1.0) and (150px <= width ) and (275px <= height) {
      .thumbnail-section {
        min-height: 85px;
      }
      .card-title {
        font-size: var(--boxel-font-size-sm);
        -webkit-line-clamp: 4;
      }
    }
    /* Large Tile (250 x 275) */
    @container fitted-card (aspect-ratio <= 1.0) and (250px <= width ) and (275px <= height) {
      .thumbnail-section {
        min-height: 150px;
      }
      .card-title {
        font-size: var(--boxel-font-size-sm);
        -webkit-line-clamp: 3;
      }
    }
    /* Vertical Cards */
    @container fitted-card (aspect-ratio <= 1.0) and (400px <= width) {
      .fitted-template {
        padding: var(--boxel-sp);
        gap: var(--boxel-sp);
      }
      .thumbnail-section {
        min-height: 236px;
      }
      .card-title {
        font-size: var(--boxel-font-size);
        -webkit-line-clamp: 4;
      }
    }
    /* Expanded Card (400 x 445) */

    /* 1.0 < Aspect Ratio (Horizontal) */
    @container fitted-card (1.0 < aspect-ratio) {
      .card-description {
        display: none;
      }
      .thumbnail-section {
        aspect-ratio: 1;
      }
    }
    @container fitted-card (1.0 < aspect-ratio) and (height <= 65px) {
      .info-section {
        align-self: center;
      }
    }
    /* Badges */
    @container fitted-card (1.0 < aspect-ratio) and (width < 250px) {
      .fitted-template {
        padding: var(--boxel-sp-xxxs);
      }
      .thumbnail-section {
        display: none;
      }
    }
    /* Small Badge (150 x 40) */
    @container fitted-card (1.0 < aspect-ratio) and (width < 250px) and (height < 65px) {
      .card-title {
        -webkit-line-clamp: 1;
        font-weight: 500;
        font-size: var(--boxel-caption-font-size);
        line-height: var(--boxel-caption-line-height);
      }
      .card-display-name {
        margin-top: 0;
      }
    }
    /* Medium Badge (150 x 65) */

    /* Large Badge (150 x 105) */
    @container fitted-card (1.0 < aspect-ratio) and (width < 250px) and (105px <= height) {
      .card-title {
        -webkit-line-clamp: 3;
      }
    }

    /* Strips */
    /* Single Strip (250 x 40) */
    @container fitted-card (1.0 < aspect-ratio) and (250px <= width) and (height < 65px) {
      .fitted-template {
        padding: var(--boxel-sp-xxxs);
      }
      .card-display-name {
        display: none;
      }
    }
    /* Double Strip (250 x 65) */
    /* Triple Strip (250 x 105) */
    /* Double Wide Strip (400 x 65) */
    /* Triple Wide Strip (400 x 105) */

    /* Horizontal Tiles */
    /* Regular Tile (250 x 170) */
    @container fitted-card (1.0 < aspect-ratio) and (250px <= width < 400px) and (170px <= height) {
      .thumbnail-section {
        height: 40%;
      }
      .card-title {
        -webkit-line-clamp: 4;
        font-size: var(--boxel-font-size-sm);
      }
    }

    /* Horizontal Cards */
    /* Compact Card (400 x 170) */
    @container fitted-card (1.0 < aspect-ratio) and (400px <= width) and (170px <= height) {
      .thumbnail-section {
        height: 100%;
      }
    }
    /* Full Card (400 x 275) */
    @container fitted-card (1.0 < aspect-ratio) and (400px <= width) and (275px <= height) {
      .fitted-template {
        padding: var(--boxel-sp);
        gap: var(--boxel-sp);
      }
      .thumbnail-section {
        max-width: 44%;
      }
      .card-title {
        -webkit-line-clamp: 4;
        font-size: var(--boxel-font-size);
      }
    }
  }


  .boxel-card-container {
    position: relative;
    background-color: var(--background, var(--boxel-light));
    border-radius: var(--radius, var(--boxel-border-radius));
    color: var(--foreground, var(--boxel-dark));
    transition:
      max-width var(--boxel-transition),
      box-shadow var(--boxel-transition);
    height: 100%;
    width: 100%;
    overflow: hidden;
  }
  .boxel-card-container--boundaries {
    box-shadow: 0 0 0 1px var(--border, var(--boxel-border-color));
  }
  .boxel-card-container--boundaries.hide-boundaries {
    box-shadow: none;
  }

  .boxel-card-container--themed {
    --_theme-heading-font-size: var(
      --brand-heading-font-size,
      var(--theme-heading-font-size)
    );
    --_theme-heading-font-family: var(
      --brand-heading-font-family,
      var(--theme-heading-font-family)
    );
    --_theme-heading-font-weight: var(
      --brand-heading-font-weight,
      var(--theme-heading-font-weight)
    );
    --_theme-heading-line-height: var(
      --brand-heading-line-height,
      var(--theme-heading-line-height)
    );

    --_theme-section-heading-font-size: var(
      --brand-section-heading-font-size,
      var(--theme-section-heading-font-size)
    );
    --_theme-section-heading-font-family: var(
      --brand-section-heading-font-family,
      var(--theme-section-heading-font-family)
    );
    --_theme-section-heading-font-weight: var(
      --brand-section-heading-font-weight,
      var(--theme-section-heading-font-weight)
    );
    --_theme-section-heading-line-height: var(
      --brand-section-heading-line-height,
      var(--theme-section-heading-line-height)
    );

    --_theme-subheading-font-size: var(
      --brand-subheading-font-size,
      var(--theme-subheading-font-size)
    );
    --_theme-subheading-font-family: var(
      --brand-subheading-font-family,
      var(--theme-subheading-font-family)
    );
    --_theme-subheading-font-weight: var(
      --brand-subheading-font-weight,
      var(--theme-subheading-font-weight)
    );
    --_theme-subheading-line-height: var(
      --brand-subheading-line-height,
      var(--theme-subheading-line-height)
    );

    --_theme-body-font-size: var(
      --brand-body-font-size,
      var(--theme-body-font-size)
    );
    --_theme-body-font-family: var(
      --brand-body-font-family,
      var(--theme-body-font-family)
    );
    --_theme-body-font-weight: var(
      --brand-body-font-weight,
      var(--theme-body-font-weight)
    );
    --_theme-body-line-height: var(
      --brand-body-line-height,
      var(--theme-body-line-height)
    );

    --_theme-caption-font-size: var(
      --brand-caption-font-size,
      var(--theme-caption-font-size)
    );
    --_theme-caption-font-family: var(
      --brand-caption-font-family,
      var(--theme-caption-font-family)
    );
    --_theme-caption-font-weight: var(
      --brand-caption-font-weight,
      var(--theme-caption-font-weight)
    );
    --_theme-caption-line-height: var(
      --brand-caption-line-height,
      var(--theme-caption-line-height)
    );

    /* setting boxel base css variable overrides, with boxel defaults as fallback */
    --_theme-spacing: calc(var(--spacing) * 4);
    --boxel-font-size: var(--_theme-body-font-size, var(--_boxel-font-size));
    --boxel-spacing: var(--_theme-spacing, var(--_boxel-spacing));
    --boxel-radius: var(--radius, var(--_boxel-radius));

    --boxel-heading-font-family: var(
      --_theme-heading-font-family,
      var(--font-sans, var(--boxel-font-family))
    );
    --boxel-heading-font-size: var(
      --_theme-heading-font-size,
      var(--boxel-font-size-lg)
    );
    --boxel-heading-line-height: var(
      --_theme-heading-line-height,
      var(--boxel-line-height-lg)
    );
    --boxel-heading-font-weight: var(--_theme-heading-font-weight, 700);

    --boxel-section-heading-font-family: var(
      --_theme-section-heading-font-family,
      var(--font-sans, var(--boxel-font-family))
    );
    --boxel-section-heading-font-size: var(
      --_theme-section-heading-font-size,
      var(--boxel-font-size-md)
    );
    --boxel-section-heading-line-height: var(
      --_theme-section-heading-line-height,
      var(--boxel-line-height-md)
    );
    --boxel-section-heading-font-weight: var(
      --_theme-section-heading-font-weight,
      500
    );

    --boxel-subheading-font-family: var(
      --_theme-subheading-font-family,
      var(--font-sans, var(--boxel-font-family))
    );
    --boxel-subheading-font-size: var(
      --_theme-subheading-font-size,
      var(--boxel-font-size)
    );
    --boxel-subheading-line-height: var(
      --_theme-subheading-line-height,
      var(--boxel-line-height)
    );
    --boxel-subheading-font-weight: var(--_theme-subheading-font-weight, 500);

    --boxel-body-font-family: var(
      --_theme-body-font-family,
      var(--font-sans, var(--boxel-font-family))
    );
    --boxel-body-font-size: var(
      --_theme-body-font-size,
      var(--boxel-font-size-sm)
    );
    --boxel-body-line-height: var(
      --_theme-body-line-height,
      var(--boxel-line-height-sm)
    );
    --boxel-body-font-weight: var(--_theme-body-font-weight, 400);

    --boxel-caption-font-family: var(
      --_theme-caption-font-family,
      var(--font-sans, var(--boxel-font-family))
    );
    --boxel-caption-font-size: var(
      --_theme-caption-font-size,
      var(--boxel-font-size-xs)
    );
    --boxel-caption-line-height: var(
      --_theme-caption-line-height,
      var(--boxel-line-height-xs)
    );
    --boxel-caption-font-weight: var(--_theme-caption-font-weight, 500);

    /*** code below this line is from "variables.css". values will be recalculated based on theming variable values ***/
    /* font-sizes */
    --boxel-font-size-2xl: calc(var(--boxel-font-size) * 2.25);
    --boxel-font-size-xl: calc(var(--boxel-font-size) * 2);
    --boxel-font-size-lg: calc(var(--boxel-font-size) * 1.375);
    --boxel-font-size-md: calc(var(--boxel-font-size) * 1.25);
    --boxel-font-size-sm: calc(var(--boxel-font-size) * 0.875);
    --boxel-font-size-xs: calc(var(--boxel-font-size) * 0.75);
    /* spacing */
    --boxel-sp-6xs: calc(var(--boxel-sp-5xs) / var(--boxel-ratio));
    --boxel-sp-5xs: calc(var(--boxel-sp-4xs) / var(--boxel-ratio));
    --boxel-sp-4xs: calc(var(--boxel-sp-3xs) / var(--boxel-ratio));
    --boxel-sp-3xs: calc(var(--boxel-sp-2xs) / var(--boxel-ratio));
    --boxel-sp-2xs: calc(var(--boxel-sp-xs) / var(--boxel-ratio));
    --boxel-sp-xs: calc(var(--boxel-sp-sm) / var(--boxel-ratio));
    --boxel-sp-sm: calc(var(--boxel-sp) / var(--boxel-ratio));
    --boxel-sp: var(--boxel-spacing); /* base */
    --boxel-sp-lg: calc(var(--boxel-sp) * var(--boxel-ratio));
    --boxel-sp-xl: calc(var(--boxel-sp-lg) * var(--boxel-ratio));
    --boxel-sp-2xl: calc(var(--boxel-sp-xl) * var(--boxel-ratio));
    --boxel-sp-3xl: calc(var(--boxel-sp-2xl) * var(--boxel-ratio));
    --boxel-sp-4xl: calc(var(--boxel-sp-3xl) * var(--boxel-ratio));
    --boxel-sp-5xl: calc(var(--boxel-sp-4xl) * var(--boxel-ratio));
    --boxel-sp-6xl: calc(var(--boxel-sp-5xl) * var(--boxel-ratio));
    /* border-radius */
    --boxel-border-radius-xxs: calc(var(--boxel-border-radius-xs) - 2.5px);
    --boxel-border-radius-xs: calc(var(--boxel-border-radius-sm) - 3px);
    --boxel-border-radius-sm: calc(var(--boxel-border-radius) - 3px);
    --boxel-border-radius: var(--boxel-radius); /* base */
    --boxel-border-radius-lg: calc(var(--boxel-border-radius) + 2px);
    --boxel-border-radius-xl: calc(var(--boxel-border-radius-lg) + 3px);
    --boxel-border-radius-xxl: calc(var(--boxel-border-radius-xl) + 5px);
    --boxel-form-control-border-radius: var(--boxel-border-radius);

    font-family: var(--boxel-body-font-family);
    font-size: var(--boxel-body-font-size);
    font-weight: var(--boxel-body-font-weight);
    letter-spacing: var(--tracking-normal);
    line-height: var(--boxel-body-line-height);
  }

  @layer reset {
    h1,h2,h3,h4,h5,h6,p {
      margin-inline-start: 0;
      margin-inline-end: 0;
      margin-block-start: 0;
      margin-block-end: 0;
    }

    h1 {
      font-family: var(--boxel-heading-font-family);
      font-size: var(--boxel-heading-font-size);
      font-weight: var(--boxel-heading-font-weight);
      line-height: var(--boxel-heading-line-height);
    }
    h2 {
      font-family: var(--boxel-section-heading-font-family);
      font-size: var(--boxel-section-heading-font-size);
      font-weight: var(--boxel-section-heading-font-weight);
      line-height: var(--boxel-section-heading-line-height);
    }
    h3 {
      font-family: var(--boxel-subheading-font-family);
      font-size: var(--boxel-subheading-font-size);
      font-weight: var(--boxel-subheading-font-weight);
      line-height: var(--boxel-subheading-line-height);
    }
    p {
      font-family: var(--boxel-body-font-family);
      font-size: var(--boxel-body-font-size);
      font-weight: var(--boxel-body-font-weight);
      line-height: var(--boxel-body-line-height);
    }
    small {
      font-size: var(--boxel-caption-font-size);
      line-height: var(--boxel-caption-line-height);
    }
  }


  @layer boxelComponentL2 {
    .boxel-context-button[data-scopedcss-93730fcca0-7ee1e10068] {
      color: inherit;
      background-color: transparent;
      transition: none;
    }
    .boxel-context-button--highlight-icon[data-scopedcss-93730fcca0-7ee1e10068] {
      color: var(--primary, var(--boxel-highlight));
    }
    .boxel-context-button--highlight[data-scopedcss-93730fcca0-7ee1e10068]:hover,
    .boxel-context-button--highlight-icon[data-scopedcss-93730fcca0-7ee1e10068]:hover {
      color: var(--primary-foreground, var(--boxel-dark));
      background-color: var(--primary, var(--boxel-highlight));
    }
    .boxel-context-button--highlight[aria-expanded='true'][data-scopedcss-93730fcca0-7ee1e10068],
    .boxel-context-button--highlight-icon[aria-expanded='true'][data-scopedcss-93730fcca0-7ee1e10068] {
      color: var(--primary-foreground, var(--boxel-dark));
      background-color: color-mix(
        in oklab,
        var(--primary, var(--boxel-highlight)),
        var(--primary-foreground, var(--boxel-dark)) 15%
      );
    }

    .boxel-context-button--ghost[data-scopedcss-93730fcca0-7ee1e10068]:hover {
      background-color: color-mix(in oklab, currentColor 10%, transparent);
    }
    .boxel-context-button--ghost[aria-expanded='true'][data-scopedcss-93730fcca0-7ee1e10068] {
      background-color: color-mix(in oklab, currentColor 25%, transparent);
    }

    .boxel-context-button--destructive-icon[data-scopedcss-93730fcca0-7ee1e10068] {
      color: var(--destructive, var(--boxel-danger));
    }
    .boxel-context-button--destructive[data-scopedcss-93730fcca0-7ee1e10068]:hover,
    .boxel-context-button--destructive-icon[data-scopedcss-93730fcca0-7ee1e10068]:hover {
      color: var(--destructive-foreground, var(--boxel-light-100));
      background-color: var(--destructive, var(--boxel-danger));
    }

    .boxel-context-button[data-scopedcss-93730fcca0-7ee1e10068]:disabled,
    .boxel-context-button[disabled][data-scopedcss-93730fcca0-7ee1e10068] {
      color: var(--boxel-400);
      pointer-events: none;
      cursor: initial;
    }
  }


  @layer {
    .boxel-dropdown__content[data-scopedcss-24626944d6-e13be58aad] {
      --boxel-dropdown-content-border-radius: var(--boxel-border-radius);
      --dropdown-background-color: var(
        --boxel-dropdown-background-color,
        var(--background, var(--boxel-light))
      );
      --dropdown-border-color: var(
        --boxel-dropdown-border-color,
        var(--border)
      );
      --dropdown-text-color: var(
        --boxel-dropdown-text-color,
        var(--foreground, var(--boxel-dark))
      );
      --dropdown-shadow: 0 5px 15px 0 rgb(0 0 0 / 25%);
      --dropdown-highlight-color: var(
        --boxel-dropdown-highlight-color,
        var(--theme-highlight, var(--boxel-highlight))
      );

      --dropdown-hover-color: var(
        --boxel-dropdown-hover-color,
        var(--theme-hover, var(--boxel-light-100))
      );

      background-color: var(--dropdown-background-color);
      border: 1px solid var(--dropdown-border-color);
      color: var(--dropdown-text-color);
      border-radius: var(--boxel-dropdown-content-border-radius);
      box-shadow: 0 5px 15px 0 rgb(0 0 0 / 25%);
    }

    /* Menu styling cater for dropdown */
    .boxel-dropdown__content[data-scopedcss-24626944d6-e13be58aad] .boxel-menu:not(.themeless) {
      --boxel-menu-color: var(--dropdown-background-color) !important;
      --boxel-menu-text-color: var(--dropdown-text-color) !important;
      --boxel-menu-hover-color: var(--dropdown-hover-color) !important;
      --boxel-menu-current-color: var(--dropdown-hover-color) !important;
      --boxel-menu-selected-font-color: var(
        --dropdown-text-color
      ) !important;
    }

    .boxel-dropdown__content[data-scopedcss-24626944d6-e13be58aad]
      
        .boxel-menu:not(.themeless)
          .boxel-menu__item:not(.boxel-menu__item--disabled):hover
       {
      color: var(--dropdown-selected-text-color);
    }

    .boxel-dropdown__content[data-scopedcss-24626944d6-e13be58aad]
      .boxel-menu:not(.themeless) .boxel-menu__separator {
      border-bottom-color: var(--dropdown-border-color) !important;
    }

    .boxel-dropdown__content[class*='variant-'][data-scopedcss-24626944d6-e13be58aad] {
      --dropdown-highlight-color: var(
        --boxel-dropdown-highlight-color,
        var(--theme-highlight, var(--boxel-highlight))
      );
      --dropdown-hover-color: var(
        --boxel-dropdown-hover-color,
        var(--theme-hover, var(--boxel-light-100))
      );
    }

    .boxel-dropdown__content.variant-primary[data-scopedcss-24626944d6-e13be58aad] {
      --dropdown-highlight-color: var(
        --boxel-dropdown-highlight-color,
        var(--primary, var(--boxel-600))
      );
      --dropdown-hover-color: var(
        --boxel-dropdown-hover-color,
        var(--theme-hover, var(--boxel-500))
      );
      --dropdown-selected-text-color: var(
        --primary-foreground,
        var(--foreground, var(--boxel-light))
      );
      --dropdown-focus-border-color: var(
        --primary,
        var(--boxel-outline-color)
      );
    }

    .boxel-dropdown__content.variant-secondary[data-scopedcss-24626944d6-e13be58aad] {
      --dropdown-highlight-color: var(
        --boxel-dropdown-highlight-color,
        var(--secondary, var(--boxel-400))
      );
      --dropdown-hover-color: var(
        --boxel-dropdown-hover-color,
        var(--theme-hover, var(--boxel-light-100))
      );
      --dropdown-selected-text-color: var(
        --secondary-foreground,
        var(--foreground, var(--boxel-dark))
      );
      --dropdown-focus-border-color: var(
        --secondary,
        var(--boxel-outline-color)
      );
    }

    .ember-basic-dropdown-content--below.gap-above[data-scopedcss-24626944d6-e13be58aad] {
      margin-top: 4px;
    }

    @media (prefers-reduced-motion: no-preference) {
      .boxel-dropdown__content.ember-basic-dropdown-content--below.ember-basic-dropdown--transitioned-in[data-scopedcss-24626944d6-e13be58aad] {
        animation: drop-fade-below-data-scopedcss-24626944d6-e13be58aad var(--boxel-transition);
      }

      .boxel-dropdown__content.ember-basic-dropdown-content--below.ember-basic-dropdown--transitioning-out[data-scopedcss-24626944d6-e13be58aad] {
        animation: drop-fade-below-data-scopedcss-24626944d6-e13be58aad var(--boxel-transition) reverse;
      }
    }

    @keyframes drop-fade-below-data-scopedcss-24626944d6-e13be58aad {
      0% {
        opacity: 0;
        transform: translateY(-20px);
      }

      100% {
        opacity: 1;
        transform: translateY(0);
      }
    }
  }


  @layer {
    .boxel-menu[data-scopedcss-78cfbd9a8f-2bd59e0a05] {
      --boxel-menu-border-radius: var(--boxel-border-radius);
      --boxel-menu-color: var(--boxel-light);
      --boxel-menu-text-color: var(--boxel-dark);
      --boxel-menu-current-color: var(--boxel-light-100);
      --boxel-menu-selected-color: var(--boxel-highlight);
      --boxel-menu-disabled-color: var(--boxel-highlight);
      --boxel-menu-font: 500 var(--boxel-font-sm);
      --boxel-menu-item-gap: var(--boxel-sp-xxs);
      --boxel-menu-item-content-padding: var(--boxel-sp-xs) var(--boxel-sp);
      list-style-type: none;
      margin: 0;
      padding: 0;
      color: var(--boxel-menu-text-color, inherit);
      background-color: var(--boxel-menu-color);
      border-radius: var(--boxel-menu-border-radius);
    }

    .boxel-menu__item[data-scopedcss-78cfbd9a8f-2bd59e0a05] {
      font: var(--boxel-menu-font);
      font-family: inherit;
      letter-spacing: var(--boxel-lsp-sm);
    }

    .boxel-menu__item--checked[data-scopedcss-78cfbd9a8f-2bd59e0a05] {
      background-color: var(--boxel-menu-selected-background-color);
      color: var(--boxel-menu-selected-font-color);
    }

    .boxel-menu__item--checked[data-scopedcss-78cfbd9a8f-2bd59e0a05]:not(.boxel-menu__item--disabled):hover {
      color: var(--boxel-menu-selected-hover-font-color);
    }

    .boxel-menu__item[data-scopedcss-78cfbd9a8f-2bd59e0a05]:not(.boxel-menu__item--disabled):hover {
      background-color: var(--boxel-menu-current-color);
      cursor: pointer;
    }

    .boxel-menu__item[data-scopedcss-78cfbd9a8f-2bd59e0a05]:first-child:hover {
      border-top-left-radius: inherit;
      border-top-right-radius: inherit;
    }

    .boxel-menu__item[data-scopedcss-78cfbd9a8f-2bd59e0a05]:last-child:hover {
      border-bottom-left-radius: inherit;
      border-bottom-right-radius: inherit;
    }

    .boxel-menu__item[data-scopedcss-78cfbd9a8f-2bd59e0a05]:only-child:hover {
      border-radius: inherit;
    }

    .boxel-menu__item > .boxel-menu__item__content[data-scopedcss-78cfbd9a8f-2bd59e0a05] {
      width: 100%;
      padding: var(--boxel-menu-item-content-padding);

      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 10px;
    }

    .boxel-menu__item--disabled .boxel-menu__item__content[data-scopedcss-78cfbd9a8f-2bd59e0a05] {
      pointer-events: none;
    }

    .boxel-menu__item > .boxel-menu__item__content[data-scopedcss-78cfbd9a8f-2bd59e0a05]:hover {
      color: inherit;
    }

    .boxel-menu__item__content[data-scopedcss-78cfbd9a8f-2bd59e0a05]:focus-visible {
      outline: var(--boxel-outline);
    }

    .boxel-menu__item--dangerous[data-scopedcss-78cfbd9a8f-2bd59e0a05] {
      --icon-color: currentColor;
      color: var(--destructive, var(--boxel-danger));
      fill: currentColor;
    }
    .boxel-menu__item--dangerous[data-scopedcss-78cfbd9a8f-2bd59e0a05]:not(:disabled):hover {
      background-color: color-mix(in oklab, currentColor 10%, transparent);
      color: var(--destructive, var(--boxel-danger-hover));
    }

    .boxel-menu__item--disabled[data-scopedcss-78cfbd9a8f-2bd59e0a05],
    .boxel-menu__item--disabled.boxel-menu__item[data-scopedcss-78cfbd9a8f-2bd59e0a05]:hover {
      background-color: initial;
      opacity: 0.4;
    }

    .boxel-menu__separator[data-scopedcss-78cfbd9a8f-2bd59e0a05] {
      margin: 0;
      border: 0;
      height: 0;
      border-bottom: 1px solid var(--boxel-purple-300);
    }

    .menu-item[data-scopedcss-78cfbd9a8f-2bd59e0a05] {
      width: 100%;
      display: flex;
      align-items: center;
      gap: var(--boxel-menu-item-gap);
    }
    .menu-item__icon-url[data-scopedcss-78cfbd9a8f-2bd59e0a05] {
      flex-shrink: 0;
      display: inline-block;
      width: 16px;
      height: 16px;
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain;
    }

    .check-icon[data-scopedcss-78cfbd9a8f-2bd59e0a05] {
      --icon-color: var(--boxel-highlight);
      visibility: collapse;
      display: contents;
    }
    .check-icon--selected[data-scopedcss-78cfbd9a8f-2bd59e0a05] {
      visibility: visible;
    }
    .checkmark[data-scopedcss-78cfbd9a8f-2bd59e0a05] {
      flex-shrink: 0;
    }
  }


  @layer {
    .realm-icon-img[data-scopedcss-07fa3e106b-6ac015244e] {
      --border-radius: var(
        --boxel-realm-icon-border-radius,
        var(--boxel-border-radius-xs)
      );
      width: var(--boxel-realm-icon-size, var(--boxel-icon-sm));
      height: var(--boxel-realm-icon-size, var(--boxel-icon-sm));
      background-size: contain;
      background-position: center;
      background-repeat: no-repeat;
      background-clip: padding-box;
      background-color: var(
        --boxel-realm-icon-background-color,
        transparent
      );
      border-radius: var(--border-radius);
      flex-shrink: 0;
    }
    .can-animate[data-scopedcss-07fa3e106b-6ac015244e] {
      --border-width: var(--boxel-realm-icon-border-width, 1px);
      border-width: var(--border-width);
      border-style: var(--boxel-realm-icon-border-style, solid);
      border-color: var(--boxel-realm-icon-border-color, transparent);
    }
    .can-animate[data-scopedcss-07fa3e106b-6ac015244e]::after {
      content: '';
      background-color: var(--boxel-dark);
      opacity: 0;
      display: block;
      height: 100%;
      border-radius: calc(var(--border-radius) - var(--border-width));
    }
    .indexing[data-scopedcss-07fa3e106b-6ac015244e] {
      animation: pulse-border-data-scopedcss-07fa3e106b-6ac015244e 2.5s linear infinite;
    }
    .indexing[data-scopedcss-07fa3e106b-6ac015244e]::after {
      animation: pulse-icon-data-scopedcss-07fa3e106b-6ac015244e 2.5s linear infinite;
    }
    @keyframes pulse-border-data-scopedcss-07fa3e106b-6ac015244e {
      0%,
      10% {
        border-color: var(--boxel-highlight);
      }
      40% {
        border-color: var(--boxel-light);
      }
      100% {
        border-color: var(--boxel-highlight);
      }
    }
    @keyframes pulse-icon-data-scopedcss-07fa3e106b-6ac015244e {
      0%,
      10% {
        opacity: 0;
        background-color: var(--boxel-dark);
      }
      40% {
        opacity: 0.7;
        background-color: var(--boxel-dark);
      }
      60%,
      70% {
        opacity: 0.7;
        background-color: var(--boxel-light);
      }
      100% {
        opacity: 0;
        background-color: var(--boxel-light);
      }
    }
  }


  .trigger[data-scopedcss-e83ff48769-0dea0d8795] {
    width: fit-content;
  }

  .tooltip[data-scopedcss-e83ff48769-0dea0d8795] {
    --tooltip-background-color: var(
      --boxel-tooltip-background-color,
      var(--background, rgb(0 0 0 / 80%))
    );
    --tooltip-text-color: var(
      --boxel-tooltip-text-color,
      var(--foreground, var(--boxel-light))
    );
    --tooltip-border-color: var(
      --boxel-tooltip-border-color,
      var(--border, var(--boxel-light-500))
    );

    background-color: var(--tooltip-background-color);
    box-shadow: 0 0 0 1px var(--tooltip-border-color);
    color: var(--tooltip-text-color);
    text-align: center;
    border-radius: var(
      --boxel-tooltip-border-radius,
      var(--boxel-border-radius-sm)
    );
    padding: var(
      --boxel-tooltip-padding,
      var(--boxel-sp-xxxs) var(--boxel-sp-sm)
    );
    width: max-content;
    position: absolute;
    font: var(--boxel-tooltip-font, var(--boxel-font-xs));
    font-family: inherit;
    z-index: 5;
  }

  .variant-default[data-scopedcss-e83ff48769-0dea0d8795] {
    --tooltip-background-color: var(
      --boxel-tooltip-background-color,
      var(--background, rgb(0 0 0 / 80%))
    );
    --tooltip-text-color: var(
      --boxel-tooltip-text-color,
      var(--foreground, var(--boxel-light))
    );
    --tooltip-border-color: var(
      --boxel-tooltip-border-color,
      var(--border, var(--boxel-light-500))
    );
  }

  .variant-primary[data-scopedcss-e83ff48769-0dea0d8795] {
    --tooltip-background-color: var(
      --boxel-tooltip-background-color,
      var(--primary, var(--boxel-600))
    );
    --tooltip-text-color: var(
      --boxel-tooltip-text-color,
      var(--primary-foreground, var(--boxel-light))
    );
    --tooltip-border-color: var(
      --boxel-tooltip-border-color,
      var(--primary, var(--boxel-600))
    );
  }

  .variant-secondary[data-scopedcss-e83ff48769-0dea0d8795] {
    --tooltip-background-color: var(
      --boxel-tooltip-background-color,
      var(--secondary, var(--boxel-400))
    );
    --tooltip-text-color: var(
      --boxel-tooltip-text-color,
      var(--secondary-foreground, var(--boxel-dark))
    );
    --tooltip-border-color: var(
      --boxel-tooltip-border-color,
      var(--secondary, var(--boxel-400))
    );
  }

  .variant-muted[data-scopedcss-e83ff48769-0dea0d8795] {
    --tooltip-background-color: var(
      --boxel-tooltip-background-color,
      var(--muted, var(--boxel-200))
    );
    --tooltip-text-color: var(
      --boxel-tooltip-text-color,
      var(--muted-foreground, var(--boxel-dark))
    );
    --tooltip-border-color: var(
      --boxel-tooltip-border-color,
      var(--muted, var(--boxel-200))
    );
  }

  .variant-destructive[data-scopedcss-e83ff48769-0dea0d8795] {
    --tooltip-background-color: var(
      --boxel-tooltip-background-color,
      var(--destructive, var(--boxel-600))
    );
    --tooltip-text-color: var(
      --boxel-tooltip-text-color,
      var(--destructive-foreground, var(--boxel-light))
    );
    --tooltip-border-color: var(
      --boxel-tooltip-border-color,
      var(--destructive, var(--boxel-600))
    );
  }

  #tooltip-overlay {
    position: absolute;
    z-index: 10000;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
  }


  @layer {
    header[data-scopedcss-abd6d4867f-445b657b5e] {
      --inner-boxel-card-header-padding: var(
        --boxel-card-header-padding,
        var(--boxel-sp-xs)
      );
      --inner-boxel-card-header-realm-icon-size: var(
        --boxel-card-header-realm-icon-size,
        var(--boxel-icon-med)
      );
      --inner-boxel-card-header-card-type-icon-size: var(
        --boxel-card-header-card-type-icon-size,
        var(--boxel-icon-sm)
      );
      position: relative;
      display: flex;
      align-items: center;
      min-height: var(--boxel-card-header-min-height, 1.875rem); /* 30px */
      width: 100%;
      box-sizing: border-box;
      overflow: hidden;
      color: var(--boxel-card-header-text-color, var(--boxel-dark));
      background-color: var(
        --boxel-card-header-background-color,
        var(--boxel-light)
      );
      border-top-right-radius: calc(
        var(--boxel-card-header-border-radius, var(--boxel-border-radius)) -
          1px
      );
      border-top-left-radius: calc(
        var(--boxel-card-header-border-radius, var(--boxel-border-radius)) -
          1px
      );
      letter-spacing: var(--boxel-card-header-letter-spacing, normal);
      text-transform: var(--boxel-card-header-text-transform);
      transition:
        background-color var(--boxel-transition),
        color var(--boxel-transition);
      gap: var(--boxel-card-header-gap, var(--boxel-sp-xs));
      padding: var(--inner-boxel-card-header-padding, var(--boxel-sp-xl));
      font: var(--boxel-card-header-font-weight, 600)
        var(--boxel-card-header-text-font, var(--boxel-font-sm));
    }
    header.is-editing[data-scopedcss-abd6d4867f-445b657b5e] {
      background-color: var(--boxel-highlight);
      color: var(--boxel-dark);
    }
    header .card-type-display-name[data-scopedcss-abd6d4867f-445b657b5e] {
      max-width: var(
        --boxel-card-header-max-width,
        100%
      ); /* this includes the space to show the header buttons */
      text-overflow: var(--boxel-card-header-text-overflow, ellipsis);
      overflow: hidden;
      text-wrap: nowrap;
      flex-grow: 1;
      flex-shrink: 1;
      min-width: 0;
      text-align: center;
      padding: 0 30px;
    }
    .card-type-display-name-text[data-scopedcss-abd6d4867f-445b657b5e] {
      font: 700 var(--boxel-font-sm);
    }
    .card-title-text[data-scopedcss-abd6d4867f-445b657b5e] {
      font: 500 var(--boxel-font-sm);
    }

    header .card-type-display-name[data-scopedcss-abd6d4867f-445b657b5e] >  svg {
      display: inline-block;
      vertical-align: middle;
      max-height: var(--inner-boxel-card-header-card-type-icon-size);
      max-width: var(--inner-boxel-card-header-card-type-icon-size);
      margin-right: var(--boxel-sp-xxxs);
      margin-bottom: calc(1rem - var(--boxel-font-size-sm));
    }
    .save-indicator[data-scopedcss-abd6d4867f-445b657b5e] {
      font: var(--boxel-font-xs);
      letter-spacing: var(--boxel-lsp-sm);
    }
    .realm-icon-container[data-scopedcss-abd6d4867f-445b657b5e] {
      display: flex;
      align-items: center;
      min-width: var(--boxel-card-header-icon-container-min-width);
      justify-content: left;
      --boxel-realm-icon-background-color: var(
        --realm-icon-background-color
      );
      --boxel-realm-icon-border-color: var(--realm-icon-border-color);
      --boxel-realm-icon-border-radius: var(
        --realm-icon-border-radius,
        7px
      );
    }

    .realm-icon[data-scopedcss-abd6d4867f-445b657b5e] {
      width: var(--inner-boxel-card-header-realm-icon-size);
      height: var(--inner-boxel-card-header-realm-icon-size);
    }

    .actions[data-scopedcss-abd6d4867f-445b657b5e] {
      display: flex;
      align-items: center;
      margin-left: auto;
      gap: var(--boxel-sp-5xs);
      min-width: var(--boxel-card-header-actions-min-width);
      justify-content: right;
    }

    .icon-button[data-scopedcss-abd6d4867f-445b657b5e],
    .icon-save[data-scopedcss-abd6d4867f-445b657b5e] {
      z-index: 1;
    }
    .icon-button[data-scopedcss-abd6d4867f-445b657b5e] svg {
      stroke-width: 2.5;
    }

    .icon-save[data-scopedcss-abd6d4867f-445b657b5e] {
      background-color: var(--boxel-light);
    }

    .utility-menu-positioner[data-scopedcss-abd6d4867f-445b657b5e] {
      --utility-menu-trigger-height: 26px;
      position: relative;
      margin-right: var(--boxel-sp);
      width: 1px;
      height: var(--utility-menu-trigger-height);
    }
    .utility-menu-trigger[data-scopedcss-abd6d4867f-445b657b5e] {
      --boxel-button-min-height: var(--utility-menu-trigger-height);
      --boxel-button-padding: 0 var(--boxel-sp-xxs);
      --boxel-button-border-radius: calc(var(--boxel-border-radius) - 4px);
      --boxel-button-font: var(--boxel-font-sm);
      --boxel-button-box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.5);
      --boxel-button-border: solid 1px rgba(0, 0, 0, 0.35);

      position: absolute;
      top: 0;
      right: 0;
      width: max-content;
    }
    .utility-menu-dropdown-arrow[data-scopedcss-abd6d4867f-445b657b5e] {
      margin-left: var(--boxel-sp-xl);
      vertical-align: middle;
    }
  }


  .circle-spinner[data-scopedcss-b99c936727-8b5efa76b3] {
    animation: rotate-data-scopedcss-b99c936727-8b5efa76b3 1.5s ease-in-out infinite;
  }
  .circle-spinner[data-scopedcss-b99c936727-8b5efa76b3] >  circle {
    animation: dash-data-scopedcss-b99c936727-8b5efa76b3 1.5s ease-in-out infinite;
  }
  @keyframes rotate-data-scopedcss-b99c936727-8b5efa76b3 {
    100% {
      transform: rotate(360deg);
    }
  }

  @keyframes dash-data-scopedcss-b99c936727-8b5efa76b3 {
    0% {
      stroke-dasharray: 1, 150;
      stroke-dashoffset: 0;
    }
    50% {
      stroke-dasharray: 90, 150;
      stroke-dashoffset: -35;
    }
    100% {
      stroke-dasharray: 90, 150;
      stroke-dashoffset: -124;
    }
  }


  @layer boxelComponentL1 {
    .input-container[data-scopedcss-a85a9fafc1-89855e1ee1] {
      --icon-size: var(--boxel-icon-sm);
      --icon-space: var(--boxel-sp-xs);
      --icon-full-length: calc(
        var(--boxel-icon-sm) + var(--boxel-sp-xs) * 2
      );

      display: grid;
      grid-template-columns: var(--icon-full-length) 1fr var(
          --icon-full-length
        );
      grid-template-areas:
        'optional optional optional'
        'pre-icon input post-icon'
        'error error error'
        'helper helper helper';
      width: 100%;
    }

    .boxel-input[data-scopedcss-a85a9fafc1-89855e1ee1] {
      grid-column: 1 / span 3;
      grid-row: 2;

      box-sizing: border-box;
      width: 100%;
      max-width: 100%;
      min-height: var(
        --boxel-input-height,
        var(--boxel-form-control-height)
      );
      padding: var(--boxel-sp-xs) 0 var(--boxel-sp-xs) var(--boxel-sp-sm);
      background-color: var(--background, var(--boxel-light));
      color: var(--foreground, var(--boxel-dark));
      border: 1px solid
        var(--border, var(--boxel-form-control-border-color));
      border-radius: var(--boxel-form-control-border-radius);
      box-shadow: var(--boxel-form-control-box-shadow);
      outline: 1px solid transparent;
      transition:
        var(--boxel-transition-properties),
        outline-color var(--boxel-transition);
    }

    .boxel-input--large[data-scopedcss-a85a9fafc1-89855e1ee1] {
      --boxel-form-control-height: 4.375rem;
      font-size: var(--boxel-font-size);
    }

    textarea[data-scopedcss-a85a9fafc1-89855e1ee1] {
      --boxel-input-height: 10rem;
      resize: both;
      overflow: auto;
    }

    .boxel-input[data-scopedcss-a85a9fafc1-89855e1ee1]:not([type='color']):disabled {
      opacity: 0.5;
      resize: none; /* do not display resize toggle since it's disabled */
    }

    .boxel-input:not([type='color'])[readonly][data-scopedcss-a85a9fafc1-89855e1ee1] {
      opacity: 0.5;
    }

    .boxel-input[data-scopedcss-a85a9fafc1-89855e1ee1]:focus-visible {
      outline-color: var(--ring, var(--boxel-highlight));
      border-color: var(--ring, var(--boxel-highlight));
    }

    .boxel-input[data-scopedcss-a85a9fafc1-89855e1ee1]::placeholder {
      color: var(--muted-foreground, var(--boxel-450));
    }

    .boxel-input[data-scopedcss-a85a9fafc1-89855e1ee1]:hover:not(:focus-visible):not(:disabled):not(.invalid):not(
        .search
      ) {
      border-color: var(--border, currentColor);
    }

    .invalid[data-scopedcss-a85a9fafc1-89855e1ee1]:not(:disabled) {
      border-color: var(--destructive, var(--boxel-error-100));
      box-shadow: 0 0 0 1px var(--destructive, var(--boxel-error-100));
    }

    .invalid[data-scopedcss-a85a9fafc1-89855e1ee1]:focus-visible {
      outline: 1px solid transparent; /* Make sure that we make the invalid state visible */
      box-shadow: 0 0 0 1.5px var(--destructive, var(--boxel-error-100));
    }

    .invalid[data-scopedcss-a85a9fafc1-89855e1ee1]:hover:not(:disabled) {
      border-color: var(--destructive, var(--boxel-error-100));
    }

    .search[data-scopedcss-a85a9fafc1-89855e1ee1] {
      --search-input-color: var(
        --boxel-input-search-color,
        var(--background, var(--boxel-light))
      );

      --search-input-background-color: var(
        --boxel-input-search-background-color,
        var(--foreground, var(--boxel-dark))
      );

      --boxel-form-control-border-color: var(--border, var(--boxel-dark));
      --boxel-form-control-border-radius: var(--boxel-border-radius-xl);

      background-color: var(--search-input-background-color);
      color: var(--search-input-color);
      padding-top: var(--boxel-sp-xxxs);
      padding-right: var(--boxel-sp-xl);
      padding-bottom: var(--boxel-sp-xxxs);
      /* to account for the icon being on the left */
      padding-right: unset;
      padding-left: var(--boxel-sp-xxl); /* leave room for icon */
      outline-width: 1px;
    }

    .boxel-input--bottom-flat[data-scopedcss-a85a9fafc1-89855e1ee1] {
      --boxel-form-control-border-radius: var(--boxel-border-radius-xl)
        var(--boxel-border-radius-xl) 0 0;
    }

    .search-icon[data-scopedcss-a85a9fafc1-89855e1ee1] {
      --icon-color: var(
        --boxel-input-search-icon-color,
        var(--boxel-highlight)
      );
    }

    .search-icon-container[data-scopedcss-a85a9fafc1-89855e1ee1] {
      grid-area: pre-icon;

      display: flex;
      height: 100%;
      align-items: center;
      justify-content: center;
    }

    .validation-icon-container[data-scopedcss-a85a9fafc1-89855e1ee1] {
      grid-area: post-icon;

      display: flex;
      align-items: center;
      justify-content: center;
      user-select: none;
    }

    .search ~ .validation-icon-container .validation-icon-loading[data-scopedcss-a85a9fafc1-89855e1ee1] {
      color: var(--primary, var(--boxel-highlight));
      --icon-color: currentColor;
    }
    .search ~ .search-icon-container .search-icon[data-scopedcss-a85a9fafc1-89855e1ee1] {
      color: var(
        --boxel-input-search-icon-color,
        var(--primary, var(--boxel-highlight))
      );
      --icon-color: currentColor;
    }

    .optional[data-scopedcss-a85a9fafc1-89855e1ee1] {
      grid-area: optional;
      justify-self: end;

      margin-bottom: var(--boxel-sp-xxxs);
      font-size: var(--boxel-font-size-xs);
      font-style: oblique;
      letter-spacing: var(--boxel-lsp);
      opacity: 0.75;
    }

    .error-message[data-scopedcss-a85a9fafc1-89855e1ee1] {
      grid-area: error;

      margin-top: var(--boxel-sp-xxxs);
      margin-left: calc(var(--boxel-sp-sm) + 1px);
      color: var(--destructive, var(--boxel-error-200));
      font-size: var(--boxel-font-size-sm);
      font-weight: 500;
      letter-spacing: var(--boxel-lsp);
    }

    .helper-text[data-scopedcss-a85a9fafc1-89855e1ee1] {
      grid-area: helper;

      margin-top: var(--boxel-sp-xs);
      margin-left: calc(var(--boxel-sp-sm) + 1px);
      font-size: var(--boxel-font-size-sm);
      letter-spacing: var(--boxel-lsp);
      opacity: 0.75;
    }

    .boxel-input:disabled ~ .error-message[data-scopedcss-a85a9fafc1-89855e1ee1],
    .boxel-input:disabled ~ .helper-text[data-scopedcss-a85a9fafc1-89855e1ee1] {
      display: none;
    }

    .boxel-input.search[data-scopedcss-a85a9fafc1-89855e1ee1]::placeholder {
      color: inherit;
      opacity: 0.6;
    }

    @media (prefers-reduced-motion: no-preference) {
      .validation-icon-loading[data-scopedcss-a85a9fafc1-89855e1ee1] {
        animation: var(--boxel-infinite-spin-animation);
      }
    }
  }


  @layer boxelComponentL1 {
    .boxel-swatch[data-scopedcss-83aebbfc4e-835abfb296] {
      --_swatch-border: color-mix(
        in oklab,
        var(--border, var(--boxel-border-color)),
        var(--foreground, var(--boxel-dark)) 10%
      );
      display: inline-flex;
      flex-direction: column;
      gap: var(--boxel-sp-xs);
    }
    .boxel-swatch--small[data-scopedcss-83aebbfc4e-835abfb296] {
      flex-direction: row;
      align-items: center;
    }
    .boxel-swatch-preview[data-scopedcss-83aebbfc4e-835abfb296] {
      max-width: 100%;
      padding: 0;
      background-color: var(--swatch-background, transparent);
      border: 1px solid
        var(--boxel-swatch-border-color, var(--_swatch-border));
      border-radius: var(--boxel-border-radius);
    }
    .boxel-swatch-preview--round[data-scopedcss-83aebbfc4e-835abfb296] {
      width: var(--swatch-width, 1.4rem);
      height: var(--swatch-height, 1.4rem);
      flex-shrink: 0;
      aspect-ratio: 1;
      border-radius: 50%;
      order: -1;
    }
    .boxel-swatch-preview--default[data-scopedcss-83aebbfc4e-835abfb296] {
      min-width: var(--swatch-width, 7rem);
      height: var(--swatch-height, 3.375rem);
    }
    .boxel-swatch-value[data-scopedcss-83aebbfc4e-835abfb296] {
      font-family: var(--font-mono, var(--boxel-monospace-font-family));
    }
  }


  @layer boxelComponentL3 {
    .color-picker[data-scopedcss-cd3f70429a-f1c014df0f] {
      --color-picker-width: 2.5rem;
      --color-picker-height: 2.5rem;
      position: relative;
    }
    .color-text-input[data-scopedcss-cd3f70429a-f1c014df0f] {
      padding-inline: var(--color-picker-width);
      transition: none;
    }
    .color-input-container[data-scopedcss-cd3f70429a-f1c014df0f] {
      position: absolute;
      top: 0;
      left: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      width: var(--color-picker-width);
      height: 100%;
      z-index: 1;
    }
    .color-input-container[data-scopedcss-cd3f70429a-f1c014df0f] >  .input-container {
      visibility: collapse;
      position: absolute;
      top: 0;
      left: 0;
      display: block;
    }
    .color-input-container[data-scopedcss-cd3f70429a-f1c014df0f]:not(.disabled):hover {
      cursor: pointer;
    }
    .color-input-container[data-scopedcss-cd3f70429a-f1c014df0f]:not(.disabled):hover .preview {
      box-shadow: var(--shadow-xs, var(--boxel-box-shadow));
    }
    .remove[data-scopedcss-cd3f70429a-f1c014df0f] {
      position: absolute;
      top: 0;
      right: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      width: var(--color-picker-width);
      height: 100%;
      z-index: 1;
      opacity: 0.5;
    }
    .remove[data-scopedcss-cd3f70429a-f1c014df0f]:focus,
    .remove[data-scopedcss-cd3f70429a-f1c014df0f]:hover {
      opacity: 1;
      outline: 0;
    }
  }


  @layer boxelComponentL3 {
    .color-palette-group[data-scopedcss-8e3655f581-5502ce24d8] {
      max-width: var(--boxel-palette-max-width, 18.75rem);
      display: grid;
      gap: var(--boxel-sp);
    }
    .color-palette[data-scopedcss-8e3655f581-5502ce24d8] {
      --swatch-size: 1.8rem;
      display: grid;
      grid-template-columns: repeat(auto-fill, var(--swatch-size));
      gap: var(--boxel-sp-xs);
    }
    .swatch-button[data-scopedcss-8e3655f581-5502ce24d8] {
      --_swatch-border: color-mix(
        in oklab,
        var(--swatch-color),
        var(--foreground, var(--boxel-dark)) 10%
      );
      --_swatch-border-selected: color-mix(
        in oklab,
        var(--border, var(--boxel-border-color)),
        var(--foreground, var(--boxel-dark)) 80%
      );
      width: var(--swatch-size);
      height: var(--swatch-size);
      aspect-ratio: 1;
      border: 2px solid transparent;
      border-radius: 50%;
      padding: 2px;
      transition: transform 0.1s ease;
      background-color: transparent;
    }
    .swatch-button[data-scopedcss-8e3655f581-5502ce24d8]::before {
      content: '';
      display: block;
      width: 100%;
      height: 100%;
      border-radius: 50%;
      background-color: var(--swatch-color);
      box-shadow: inset 0 0 0 1px var(--_swatch-border);
    }
    .swatch-button[data-scopedcss-8e3655f581-5502ce24d8]:hover:not(:disabled) {
      cursor: pointer;
      transform: scale(1.1);
    }
    .swatch-button.selected[data-scopedcss-8e3655f581-5502ce24d8] {
      border-color: var(--_swatch-border-selected);
    }
    .swatch-button.selected[data-scopedcss-8e3655f581-5502ce24d8]::before {
      box-shadow: none;
    }
  }


  @layer {
    .boxel-container[data-scopedcss-debcf72a17-a3f3ae1bc5] {
      padding: var(--boxel-container-padding, var(--boxel-sp));
    }
    .boxel-grid[data-scopedcss-debcf72a17-a3f3ae1bc5] {
      display: grid;
      gap: var(--boxel-container-gap, var(--boxel-sp));
    }
    .boxel-inline-grid[data-scopedcss-debcf72a17-a3f3ae1bc5] {
      display: inline-grid;
      gap: var(--boxel-container-gap, var(--boxel-sp));
    }
    .boxel-flex[data-scopedcss-debcf72a17-a3f3ae1bc5] {
      display: flex;
      flex-wrap: wrap;
      gap: var(--boxel-container-gap, var(--boxel-sp));
      align-items: center;
    }
    .boxel-inline-flex[data-scopedcss-debcf72a17-a3f3ae1bc5] {
      display: inline-flex;
      flex-wrap: wrap;
      gap: var(--boxel-container-gap, var(--boxel-sp));
      align-items: center;
    }
  }


  .month-calendar[data-scopedcss-5cace6edb9-3c8ebc6f20] {
    width: 100%;
  }
  .months-container[data-scopedcss-5cace6edb9-3c8ebc6f20] {
    display: flex;
    flex-direction: row;
    gap: var(--boxel-sp-lg);
  }
  .nav-container[data-scopedcss-5cace6edb9-3c8ebc6f20] {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .days-container[data-scopedcss-5cace6edb9-3c8ebc6f20] {
    margin-top: auto;
  }


  .draggable-container[data-scopedcss-c3fe521f22-88896cff6b] {
    --draggable-overlay-z-index: 5;
    display: flex;
    overflow-x: auto;
    flex-grow: 1;
    gap: var(--dnd-container-gap, var(--boxel-sp));
    transition: transform 0.5s ease;
    height: 100%;
  }
  .draggable-card[data-scopedcss-c3fe521f22-88896cff6b] {
    border: 1px solid var(--boxel-300);
    border-radius: var(--boxel-border-radius);
    background: var(--boxel-light);
    transition:
      all 0.3s ease,
      filter 0.3s ease;
    cursor: grab;
  }
  .draggable-card[data-scopedcss-c3fe521f22-88896cff6b] :where(.boundaries) {
    box-shadow: none;
  }
  .draggable-card.is-loading[data-scopedcss-c3fe521f22-88896cff6b] {
    position: relative;
  }
  .draggable-card.is-loading > .overlay[data-scopedcss-c3fe521f22-88896cff6b] {
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background-color: rgb(38 38 38 / 50%);
    z-index: var(--draggable-overlay-z-index);
    border-radius: var(--boxel-border-radius);
  }
  .draggable-card.is-loading > .loader[data-scopedcss-c3fe521f22-88896cff6b] {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: calc(var(--draggable-overlay-z-index) + 1);
  }
  .draggable-card.is-on-target[data-scopedcss-c3fe521f22-88896cff6b] {
    transform: scale(0.95);
    filter: brightness(0.7);
  }
  .draggable-card-empty[data-scopedcss-c3fe521f22-88896cff6b] {
    filter: brightness(0.7);
    border: 1px dashed var(--boxel-300);
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .column[data-scopedcss-c3fe521f22-88896cff6b] {
    display: flex;
    flex-direction: column;
    flex: 0 0 var(--boxel-xs-container);
    height: 100%;
    border-radius: var(--dnd-column-border-radius, 14px);
    overflow: hidden;
    background-color: var(--dnd-drop-zone-bg, var(--boxel-200));
  }
  .column-header[data-scopedcss-c3fe521f22-88896cff6b] {
    position: sticky;
    z-index: calc(var(--draggable-overlay-z-index) +2);
    top: 0;
    background-color: var(--dnd-header-bg, transparent);
    font-weight: 600;
    padding: var(--boxel-sp-sm) var(--boxel-sp) var(--boxel-sp-xxs)
      var(--boxel-sp);
  }
  .column-drop-zone[data-scopedcss-c3fe521f22-88896cff6b] {
    position: relative;
    padding: var(--boxel-sp-xs);
    display: grid;
    align-content: flex-start;
    gap: var(--boxel-sp-xs);
    height: 100%;
    overflow-y: auto;
  }
  .column-drop-zone:has(.draggable-card.is-dragging)
    .draggable-card[data-scopedcss-c3fe521f22-88896cff6b]:not(.is-dragging) {
    filter: brightness(0.7);
  }


  .entity-icon-display[data-scopedcss-96137ebe15-e7150048d0] {
    display: var(--entity-display-display, flex);
    align-items: var(--entity-display-align-items, flex-start);
    flex-direction: var(--entity-display-flex-direction, row);
    gap: var(--entity-display-gap, var(--boxel-sp-xxxs));
  }
  .entity-icon-display.center[data-scopedcss-96137ebe15-e7150048d0] {
    align-items: center;
  }
  .entity-icon[data-scopedcss-96137ebe15-e7150048d0] {
    display: var(--entity-display-icon-display, inline-flex);
    align-items: var(--entity-display-icon-align-items, center);
    justify-content: var(--entity-display-icon-justify-content, center);
    flex-shrink: 0;
    width: var(--entity-display-icon-size, var(--boxel-icon-sm));
    height: var(--entity-display-icon-size, var(--boxel-icon-sm));
  }
  .entity-info[data-scopedcss-96137ebe15-e7150048d0] {
    display: var(--entity-display-info-display, flex);
    flex-direction: var(--entity-display-info-flex-direction, column);
    gap: var(--entity-display-info-gap, var(--boxel-sp-xxxs));
  }
  .entity-title-tag-container[data-scopedcss-96137ebe15-e7150048d0] {
    display: var(--entity-display-title-tag-container-display, flex);
    flex-wrap: var(--entity-display-title-tag-container-flex-wrap, wrap);
    align-items: var(
      --entity-display-title-tag-container-align-items,
      center
    );
    gap: var(
      --entity-display-title-tag-container-gap,
      var(--boxel-sp-xxxs)
    );
  }
  .entity-title[data-scopedcss-96137ebe15-e7150048d0] {
    color: var(--entity-display-title-color, var(--boxel-dark));
    font-size: var(
      --entity-display-title-font-size,
      var(--boxel-font-size-sm)
    );
    font-weight: var(--entity-display-title-font-weight, 600);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: var(--entity-display-title-line-clamp, 1);
    margin: var(--entity-display-title-margin, 0);
    word-break: var(--entity-display-title-word-break, break-word);
  }
  .entity-title.underline[data-scopedcss-96137ebe15-e7150048d0] {
    text-decoration: var(--entity-display-title-underline, underline);
  }
  .entity-content[data-scopedcss-96137ebe15-e7150048d0] {
    color: var(--entity-display-content-color, var(--boxel-400));
    font-size: var(
      --entity-display-content-font-size,
      var(--boxel-font-size-xs)
    );
    font-weight: var(--entity-display-content-font-weight, 400);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: var(--entity-display-content-line-clamp, 1);
    margin: var(--entity-display-content-margin, 0);
    word-break: var(--entity-display-content-word-break, break-word);
  }


  .entity-thumbnail-display[data-scopedcss-94276192c2-fe0563f15d] {
    display: var(--entity-display-display, flex);
    align-items: var(--entity-display-align-items, flex-start);
    gap: var(--entity-display-gap, var(--boxel-sp-xxxs));
  }
  .entity-thumbnail-display.center[data-scopedcss-94276192c2-fe0563f15d] {
    align-items: center;
  }
  .entity-thumbnail[data-scopedcss-94276192c2-fe0563f15d] {
    display: var(--entity-display-thumbnail-display, inline-flex);
    align-items: var(--entity-display-thumbnail-align-items, center);
    justify-content: var(
      --entity-display-thumbnail-justify-content,
      center
    );
    flex-shrink: 0;
    width: var(--entity-display-thumbnail-size, var(--boxel-icon-sm));
    height: var(--entity-display-thumbnail-size, var(--boxel-icon-sm));
    overflow: hidden;
  }
  .entity-info[data-scopedcss-94276192c2-fe0563f15d] {
    display: var(--entity-display-info-display, flex);
    flex-direction: var(--entity-display-info-flex-direction, column);
    gap: var(--entity-display-info-gap, var(--boxel-sp-xxxs));
  }
  .entity-title-tag-container[data-scopedcss-94276192c2-fe0563f15d] {
    display: var(--entity-display-title-tag-container-display, flex);
    flex-wrap: var(--entity-display-title-tag-container-flex-wrap, wrap);
    align-items: var(
      --entity-display-title-tag-container-align-items,
      center
    );
    gap: var(
      --entity-display-title-tag-container-gap,
      var(--boxel-sp-xxxs)
    );
  }
  .entity-title[data-scopedcss-94276192c2-fe0563f15d] {
    color: var(--entity-display-title-color, var(--boxel-dark));
    font-size: var(
      --entity-display-title-font-size,
      var(--boxel-font-size-sm)
    );
    font-weight: var(--entity-display-title-font-weight, 600);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: var(--entity-display-title-line-clamp, 1);
    margin: var(--entity-display-title-margin, 0);
    word-break: var(--entity-display-title-word-break, break-word);
  }
  .entity-title.underline[data-scopedcss-94276192c2-fe0563f15d] {
    text-decoration: var(--entity-display-title-underline, underline);
  }
  .entity-content[data-scopedcss-94276192c2-fe0563f15d] {
    color: var(--entity-display-content-color, var(--boxel-400));
    font-size: var(
      --entity-display-content-font-size,
      var(--boxel-font-size-xs)
    );
    font-weight: var(--entity-display-content-font-weight, 400);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: var(--entity-display-content-line-clamp, 1);
    margin: var(--entity-display-content-margin, 0);
    word-break: var(--entity-display-content-word-break, break-word);
  }


  @layer boxelComponentL1 {
    .boxel-label[data-scopedcss-f6740e3ac2-a0a886d781] {
      color: var(--boxel-label-color);
      font-size: var(--boxel-label-font-size, var(--boxel-body-font-size));
      font-weight: var(--boxel-label-font-weight, 500);
      line-height: var(--boxel-label-line-height, 1.1);
      font-family: inherit;
      letter-spacing: var(--boxel-label-letter-spacing, var(--boxel-lsp-sm));
    }
    .boxel-label--small[data-scopedcss-f6740e3ac2-a0a886d781] {
      font-size: var(
        --boxel-label-font-size-small,
        var(--boxel-caption-font-size)
      );
      line-height: var(
        --boxel-label-line-height-small,
        var(--boxel-caption-line-height)
      );
    }
    .boxel-label--default[data-scopedcss-f6740e3ac2-a0a886d781] {
      font-size: var(--boxel-label-font-size, var(--boxel-body-font-size));
      line-height: var(
        --boxel-label-line-height,
        var(--boxel-body-line-height)
      );
    }
  }


  @layer boxelComponentL2 {
    .boxel-field[data-scopedcss-73b27f2295-b2bafc38b4] {
      --boxel-field-label-align: normal;
      --boxel-field-label-padding-top: 0;

      display: grid;
      width: 100%;
      max-width: 100%;
      overflow-wrap: break-word;
    }
    .label-container[data-scopedcss-73b27f2295-b2bafc38b4] {
      align-items: start;
    }
    .with-icon .label-container[data-scopedcss-73b27f2295-b2bafc38b4] {
      display: flex;
      gap: var(--boxel-sp-xs);
    }

    .centered-display[data-scopedcss-73b27f2295-b2bafc38b4] {
      justify-items: center;
    }

    .small-label[data-scopedcss-73b27f2295-b2bafc38b4] {
      --boxel-field-label-size: minmax(4rem, 10%);
    }

    .label[data-scopedcss-73b27f2295-b2bafc38b4] {
      --boxel-label-letter-spacing: var(--boxel-lsp-xs);

      display: flex;
      align-items: var(--boxel-field-label-align);
      padding-top: var(--boxel-field-label-padding-top);
    }

    .boxel-field__icon[data-scopedcss-73b27f2295-b2bafc38b4] {
      flex-shrink: 0;
    }

    .content[data-scopedcss-73b27f2295-b2bafc38b4] {
      max-width: 100%;
      padding: var(
        --boxel-field-content-padding,
        var(--boxel-outline-width)
      ); /* necessary for our various overlays utilizing box-shadow */
      word-break: break-word;
    }

    .horizontal[data-scopedcss-73b27f2295-b2bafc38b4] {
      grid-template-columns:
        var(--boxel-field-label-size, minmax(8rem, 25%))
        1fr;
      min-height: var(--boxel-form-control-height);
    }

    .horizontal > .label-container[data-scopedcss-73b27f2295-b2bafc38b4] {
      padding-top: var(--boxel-sp-sm);
    }

    .horizontal > .content[data-scopedcss-73b27f2295-b2bafc38b4] {
      align-self: center;
    }

    .vertical[data-scopedcss-73b27f2295-b2bafc38b4] {
      grid-template-rows: auto 1fr;
      gap: var(--boxel-sp-4xs);
    }

    .vertical .label[data-scopedcss-73b27f2295-b2bafc38b4] {
      grid-column: 2;
    }

    .boxel-field[data-scopedcss-73b27f2295-b2bafc38b4] .boxel-field .boxel-label:not(.boxel-label--default) {
      font-size: var(
        --boxel-field-label-font-size-small,
        var(--boxel-font-size-xs)
      );
      line-height: var(--boxel-field-label-line-height-small, calc(15 / 11));
    }
  }


  @layer boxelComponentL2 {
    .filter-list[data-scopedcss-4d119660ec-981c7bdf92] {
      display: flex;
      flex-direction: column;
      gap: var(--boxel-sp-4xs);
      list-style-type: none;
      padding-inline-start: 0;
      margin-block: 0;
    }
    .filter-list[data-scopedcss-4d119660ec-981c7bdf92] .filter-list {
      margin-top: var(--boxel-sp-4xs);
      padding-inline-start: var(--boxel-sp);
    }
  }


  @layer boxelComponentL2 {
    .list-item-buttons[data-scopedcss-4d119660ec-cbf2be1130] {
      display: flex;
      border-radius: var(--boxel-border-radius-sm);
      color: inherit;
      background-color: inherit;
    }
    .list-item-buttons.is-expanded[data-scopedcss-4d119660ec-cbf2be1130] {
      background-color: var(
        --boxel-filter-expanded-background,
        color-mix(
          in oklab,
          var(--accent, var(--boxel-200)) 30%,
          transparent
        )
      );
      color: var(--boxel-filter-expanded-foreground, var(--foreground));
    }
    .list-item-buttons[data-scopedcss-4d119660ec-cbf2be1130]:not(.is-selected):hover {
      background-color: var(
        --boxel-filter-hover-background,
        color-mix(
          in oklab,
          var(--accent, var(--boxel-200)) 95%,
          transparent
        )
      );
      color: var(--boxel-filter-hover-foreground, var(--accent-foreground));
    }
    .list-item-buttons.is-selected[data-scopedcss-4d119660ec-cbf2be1130] {
      background-color: var(
        --boxel-filter-selected-background,
        var(--foreground, var(--boxel-dark))
      );
      color: var(
        --boxel-filter-selected-foreground,
        var(--background, var(--boxel-light))
      );
    }
    .list-item-buttons.is-selected[data-scopedcss-4d119660ec-cbf2be1130]:hover {
      background-color: var(
        --boxel-filter-selected-hover-background,
        color-mix(
          in oklab,
          var(--foreground, var(--boxel-dark)) 90%,
          transparent
        )
      );
      color: var(
        --boxel-filter-selected-hover-foreground,
        var(--background, var(--boxel-light))
      );
    }
    .dropdown-toggle[data-scopedcss-4d119660ec-cbf2be1130] {
      --boxel-icon-button-width: 2rem;
      --boxel-icon-button-height: 2rem;
      flex-shrink: 0;
    }
    .is-expanded > .dropdown-toggle[data-scopedcss-4d119660ec-cbf2be1130] {
      transform: rotate(180deg);
    }
    .filter-list__button[data-scopedcss-4d119660ec-cbf2be1130] {
      flex-grow: 1;
      width: 100%;
      display: flex;
      justify-content: flex-start;
      gap: var(--boxel-sp-xs);
      font: 500 var(--boxel-font-sm);
      font-family: inherit;
      letter-spacing: var(--boxel-lsp-xs);
      border-radius: var(--boxel-border-radius-sm);
      max-width: 100%;
      overflow: hidden;
      text-align: left;
    }
    .filter-list__button[data-scopedcss-4d119660ec-cbf2be1130]:hover,
    .filter-list__button[data-scopedcss-4d119660ec-cbf2be1130]:focus {
      color: inherit;
      background-color: transparent;
    }
    .dropdown-toggle[data-scopedcss-4d119660ec-cbf2be1130],
    .filter-list__button[data-scopedcss-4d119660ec-cbf2be1130] {
      border: none;
      transition: none;
    }
    [data-scopedcss-4d119660ec-cbf2be1130] .filter-list__icon {
      flex-shrink: 0;
      width: var(--boxel-icon-xs);
      height: var(--boxel-icon-xs);
      vertical-align: top;
    }
  }


  @layer boxelComponentL1 {
    .grid-container[data-scopedcss-6aa60ffeba-6ff9f6f12e] {
      display: grid;
      gap: var(--boxel-sp);
    }
  }

  @layer reset {
    .grid-container[data-scopedcss-6aa60ffeba-6ff9f6f12e] h2,
    .grid-container[data-scopedcss-6aa60ffeba-6ff9f6f12e] h3 {
      margin: 0;
    }
  }


  @layer {
    header[data-scopedcss-5dd0f890d1-3a5795273e] {
      --_h-padding: var(--boxel-sp);
      --_h-min-height: 1.875rem; /* 30px */
      position: relative;
      display: flex;
      align-items: center;
      gap: var(--boxel-header-gap, var(--boxel-sp-xs));
      max-width: 100%;
      min-height: var(--boxel-header-min-height, var(--_h-min-height));
      padding: var(--boxel-header-padding, var(--_h-padding));
      background-color: var(
        --boxel-header-background-color,
        var(--_h-bg-color)
      );
      color: var(--boxel-header-text-color, var(--_h-color));
    }
    .large[data-scopedcss-5dd0f890d1-3a5795273e] {
      --_h-padding: var(--boxel-sp-xl);
      --_h-title-fs: var(--typescale-h1, var(--boxel-font-size-lg));
      --_h-title-fw: 600;
      --_h-title-lh: calc(30 / 22);
    }
    .hasBottomBorder[data-scopedcss-5dd0f890d1-3a5795273e] {
      border-bottom: 1px solid
        var(--boxel-header-border-color, var(--border, var(--boxel-200)));
    }
    .has-background[data-scopedcss-5dd0f890d1-3a5795273e] {
      --_h-bg-color: var(--muted, var(--boxel-100));
      --_h-color: var(--muted-foreground, var(--boxel-dark));
    }
    .title[data-scopedcss-5dd0f890d1-3a5795273e] {
      font-size: var(--boxel-header-title-font-size, var(--_h-title-fs));
      font-weight: var(--boxel-header-title-font-weight, var(--_h-title-fw));
      line-height: var(
        --boxel-header-title-line-height,
        var(--lineheight-base, var(--_h-title-lh))
      );
    }
    .detail[data-scopedcss-5dd0f890d1-3a5795273e] {
      display: flex;
      align-items: center;
      margin-left: var(--boxel-header-detail-margin-left, auto);
    }
    header[data-scopedcss-5dd0f890d1-3a5795273e] >  svg {
      flex-shrink: 0;
    }
  }


  .boxel-trigger[data-scopedcss-b78684286a-09efed0c92] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: var(--boxel-sp-xxxs);
    padding: var(--boxel-sp-xs);
    font: var(--boxel-font-sm);
    font-family: inherit;
    letter-spacing: var(--boxel-lsp-sm);
    outline: none;
    cursor: pointer;
  }
  .boxel-trigger-content[data-scopedcss-b78684286a-09efed0c92] {
    display: flex;
    flex-wrap: wrap;
    gap: var(--boxel-sp-xxs);
  }
  .boxel-trigger-placeholder[data-scopedcss-b78684286a-09efed0c92] {
    color: var(--boxel-450);
    font: var(--boxel-font-sm);
    font-family: inherit;
    letter-spacing: var(--boxel-lsp-sm);
  }


  /*Ember power select has a right padding to the trigger element*/
  .ember-power-select-trigger[data-scopedcss-b78684286a-09efed0c92] {
    padding: 0px;
  }


  .icon[data-scopedcss-b78684286a-2c8051aefa] {
    width: 10px;
    height: 10px;
    flex-shrink: 0;
  }
  .is-open[data-scopedcss-b78684286a-2c8051aefa] {
    transform: rotate(180deg);
  }

  .icon.is-inverted[data-scopedcss-b78684286a-2c8051aefa] {
    transform: rotate(180deg);
  }

  .icon.is-inverted.is-open[data-scopedcss-b78684286a-2c8051aefa] {
    transform: rotate(0deg);
  }


  .boxel-select[data-scopedcss-1dae62edf2-e4d5fb455b] {
    --select-background-color: var(
      --boxel-select-background-color,
      var(--background, var(--boxel-light))
    );
    --select-border-color: var(
      --boxel-select-border-color,
      var(--border, var(--boxel-border-color))
    );
    --select-text-color: var(
      --boxel-select-text-color,
      var(--foreground, var(--boxel-dark))
    );
    --select-placeholder-color: var(
      --boxel-select-placeholder-color,
      var(--muted-foreground, var(--boxel-450))
    );
    --select-focus-border-color: var(
      --boxel-select-focus-border-color,
      var(--primary, var(--boxel-dark))
    );

    position: relative;
    display: flex;
    align-items: stretch;
    padding: 0;
    overflow: hidden;
    border: 1px solid var(--select-border-color);
    border-radius: var(--boxel-form-control-border-radius);
    max-width: 100%;
    width: 100%;
    background-color: var(--select-background-color);
    color: var(--select-text-color);
    transition: border-color var(--boxel-transition);
  }
  .boxel-select[aria-expanded='true'][data-scopedcss-1dae62edf2-e4d5fb455b] {
    border-radius: var(--boxel-form-control-border-radius);
  }

  .boxel-select[data-scopedcss-1dae62edf2-e4d5fb455b]:not([aria-disabled='true']):hover {
    cursor: pointer;
    border-color: var(--select-focus-border-color);
  }

  .boxel-select[data-scopedcss-1dae62edf2-e4d5fb455b]:focus-visible {
    outline: 2px solid var(--ring, var(--boxel-highlight-hover));
  }

  .boxel-select[data-scopedcss-1dae62edf2-e4d5fb455b] .boxel-trigger {
    padding: var(--boxel-sp-xs)
      calc(var(--boxel-sp-xxxs) + var(--boxel-sp-xxs));
  }

  .variant-default[data-scopedcss-1dae62edf2-e4d5fb455b] {
    --select-background-color: var(
      --boxel-select-background-color,
      var(--background, var(--boxel-light))
    );
    --select-border-color: var(
      --boxel-select-border-color,
      var(--border, var(--boxel-border-color))
    );
    --select-text-color: var(
      --boxel-select-text-color,
      var(--foreground, var(--boxel-dark))
    );
    --select-focus-border-color: var(
      --boxel-select-focus-border-color,
      var(--primary, var(--boxel-dark))
    );
  }

  .variant-primary[data-scopedcss-1dae62edf2-e4d5fb455b] {
    --select-background-color: var(
      --boxel-select-background-color,
      var(--primary, var(--boxel-600))
    );
    --select-border-color: var(
      --boxel-select-border-color,
      var(--primary, var(--boxel-600))
    );
    --select-text-color: var(
      --boxel-select-text-color,
      var(--primary-foreground, var(--boxel-light))
    );
    --select-focus-border-color: var(
      --boxel-select-focus-border-color,
      var(--primary, var(--boxel-600))
    );
  }

  .variant-secondary[data-scopedcss-1dae62edf2-e4d5fb455b] {
    --select-background-color: var(
      --boxel-select-background-color,
      var(--secondary, var(--boxel-400))
    );
    --select-border-color: var(
      --boxel-select-border-color,
      var(--secondary, var(--boxel-400))
    );
    --select-text-color: var(
      --boxel-select-text-color,
      var(--secondary-foreground, var(--boxel-dark))
    );
    --select-focus-border-color: var(
      --boxel-select-focus-border-color,
      var(--secondary, var(--boxel-400))
    );
  }

  .variant-muted[data-scopedcss-1dae62edf2-e4d5fb455b] {
    --select-background-color: var(
      --boxel-select-background-color,
      var(--muted, var(--boxel-200))
    );
    --select-border-color: var(
      --boxel-select-border-color,
      var(--muted, var(--boxel-200))
    );
    --select-text-color: var(
      --boxel-select-text-color,
      var(--muted-foreground, var(--boxel-dark))
    );
    --select-focus-border-color: var(
      --boxel-select-focus-border-color,
      var(--muted, var(--boxel-200))
    );
  }

  .variant-destructive[data-scopedcss-1dae62edf2-e4d5fb455b] {
    --select-background-color: var(
      --boxel-select-background-color,
      var(--destructive, var(--boxel-600))
    );
    --select-border-color: var(
      --boxel-select-border-color,
      var(--destructive, var(--boxel-600))
    );
    --select-text-color: var(
      --boxel-select-text-color,
      var(--destructive-foreground, var(--boxel-light))
    );
    --select-focus-border-color: var(
      --boxel-select-focus-border-color,
      var(--destructive, var(--boxel-danger))
    );
  }

  .boxel-select[aria-disabled='true'][data-scopedcss-1dae62edf2-e4d5fb455b] {
    background-color: var(--muted, var(--boxel-100));
    color: var(--select-placeholder-color);
    cursor: not-allowed;
    pointer-events: none;
  }


  .boxel-select-options-list[data-scopedcss-1dae62edf2-4e3b28a4c6] {
    list-style: none;
    padding: var(--boxel-sp-xxxs);
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
    overflow-y: auto;
    max-width: 100%;
    max-height: var(--boxel-select-options-list-max-height, 12.25rem);
    position: relative;
    box-sizing: border-box;
  }

  .boxel-select-option-item[data-scopedcss-1dae62edf2-4e3b28a4c6] {
    margin: 0;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: var(--boxel-sp-xxs);
    max-width: 100%;
    padding: var(--boxel-sp-xxs);
    margin-bottom: 1px;
    font-family: inherit;
    font-size: var(--boxel-font-size-sm);
    letter-spacing: var(--boxel-lsp-sm);
    text-align: left;
    background-color: var(--dropdown-background-color);
    color: var(--dropdown-text-color);
    border: none;
    transition:
      background-color var(--boxel-transition),
      color var(--boxel-transition);
    box-sizing: border-box;
  }

  .boxel-select-option-item[data-scopedcss-1dae62edf2-4e3b28a4c6]:not([aria-disabled='true']):hover {
    background-color: var(--dropdown-hover-color);
    color: var(--dropdown-selected-text-color);
    cursor: pointer;
  }

  .boxel-select-option-item.ember-power-select-option--highlighted[data-scopedcss-1dae62edf2-4e3b28a4c6] {
    background-color: var(--dropdown-hover-color);
    color: var(--dropdown-selected-text-color);
  }

  .boxel-select-option-item.ember-power-select-option--selected[data-scopedcss-1dae62edf2-4e3b28a4c6] {
    background-color: var(--dropdown-highlight-color);
    color: var(--dropdown-selected-text-color);
  }

  .boxel-select-option-item.ember-power-select-option--selected.ember-power-select-option--highlighted[data-scopedcss-1dae62edf2-4e3b28a4c6],
  .boxel-select-option-item.ember-power-select-option--selected[data-scopedcss-1dae62edf2-4e3b28a4c6]:hover {
    background-color: color-mix(
      in oklab,
      var(--dropdown-highlight-color) 95%,
      var(--dropdown-selected-text-color)
    );
  }

  .boxel-select-option-item[aria-disabled='true'][data-scopedcss-1dae62edf2-4e3b28a4c6] {
    opacity: 0.5;
    cursor: not-allowed;
    pointer-events: none;
  }

  .boxel-select-option-icon[data-scopedcss-1dae62edf2-4e3b28a4c6] {
    width: var(--boxel-icon-xs);
    height: var(--boxel-icon-xs);
    flex-shrink: 0;
    margin-right: var(--boxel-sp-xxs);
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .boxel-select-option-text[data-scopedcss-1dae62edf2-4e3b28a4c6] {
    padding: 1px; /* spacing for 1px card box-shadow border */
    overflow: hidden;
  }

  .boxel-select-option-checkmark-container[data-scopedcss-1dae62edf2-4e3b28a4c6] {
    /* maintain space for icon and keep content widths the same */
    width: var(--boxel-icon-med);
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .boxel-select-option-checkmark[data-scopedcss-1dae62edf2-4e3b28a4c6] {
    height: var(--boxel-icon-xs);
    max-width: 100%;
    aspect-ratio: 1;
    flex-shrink: 0;
    --icon-color: currentColor;
  }


  @layer boxelComponentL1 {
    .text-accessory[data-scopedcss-3ee92bdb06-f8771d5ccf] {
      align-items: center;
      color: var(--muted-foreground, var(--boxel-700));
      display: flex;
      font-size: var(--boxel-font-size-sm);
      padding: var(--boxel-input-group-padding-y)
        var(--boxel-input-group-padding-x);
      text-align: center;
      white-space: nowrap;
    }
  }


  .boxel-input-group__accessory[data-scopedcss-3ee92bdb06-c89ea75f0a] {
    background: none;
    border: none;
    border-radius: 0;
    margin: 0;
    min-height: var(--boxel-input-group-height);
    outline-offset: 0;
  }

  .boxel-input-group__select-accessory[data-scopedcss-3ee92bdb06-c89ea75f0a] {
    z-index: 2;
  }

  .boxel-input-group__select-accessory[data-scopedcss-3ee92bdb06-c89ea75f0a] .boxel-select {
    min-height: inherit;
    background: none;
    border: none;
    font-weight: 600;
    outline-offset: 0px;
  }

  .boxel-input-group__select-accessory[data-scopedcss-3ee92bdb06-c89ea75f0a]
    .boxel-select .ember-power-select-placeholder {
    font-weight: 600;
  }
  .boxel-input-group__select-accessory[data-scopedcss-3ee92bdb06-c89ea75f0a]
    [aria-expanded='true'] .ember-power-select-status-icon {
    transform: rotate(180deg);
  }

  .boxel-input-group__select-accessory--disabled[data-scopedcss-3ee92bdb06-c89ea75f0a] {
    opacity: 0.5;
  }

  .boxel-input-group--invalid .boxel-input-group__select-accessory[data-scopedcss-3ee92bdb06-c89ea75f0a] {
    border-color: var(--destructive, var(--boxel-error-100));
  }

  .boxel-input-group__select-accessory[data-scopedcss-3ee92bdb06-c89ea75f0a]
    .ember-power-select-status-icon {
    position: relative;
  }

  
    .boxel-input-group__select-accessory__dropdown
      .ember-power-select-option
   {
    padding: var(--boxel-sp-xs) var(--boxel-sp-xs) var(--boxel-sp-xs)
      var(--boxel-sp-xs);
  }


  .container[data-scopedcss-dbd745ef01-f153013829] {
    display: flex;
    flex-direction: column;
  }
  .boxel-input-group[data-scopedcss-dbd745ef01-f153013829] {
    --boxel-input-group-padding-x: var(--boxel-sp-sm);
    --boxel-input-group-padding-y: var(--boxel-sp-xxs);
    --boxel-input-group-border-color: var(
      --border,
      var(--boxel-form-control-border-color)
    );
    --boxel-input-group-border-radius: var(
      --boxel-form-control-border-radius
    );
    --boxel-input-group-inner-border-radius: calc(
      var(--boxel-input-group-border-radius) - 1px
    );
    --boxel-input-group-interior-border-width: 0;
    --boxel-input-group-height: var(
      --boxel-input-height,
      var(--boxel-form-control-height)
    );
    --boxel-input-group-icon-length: calc(
      var(--boxel-icon-sm) + var(--boxel-sp-xs) * 2
    );

    border-radius: var(--boxel-input-group-border-radius);
    cursor: text;
    position: relative;
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    width: 100%;
    max-width: 100%;
    min-height: var(--boxel-input-group-height);
    background-color: var(--background, var(--boxel-light));
    color: var(--foreground, var(--boxel-dark));
    border: 1px solid var(--boxel-input-group-border-color);
  }

  @layer boxelComponentL1 {
    .boxel-input-group[data-scopedcss-dbd745ef01-f153013829] >  .form-control {
      -moz-appearance: none;
      -webkit-appearance: none;
      appearance: none;
      background-clip: padding-box;
      display: block;
      flex: 1 1 auto;
      min-width: 0;
      padding: var(--boxel-input-group-padding-y)
        var(--boxel-input-group-padding-x);
      width: 1%;
      background-color: inherit;
      color: inherit;
    }
    .boxel-input-group[data-scopedcss-dbd745ef01-f153013829] >  .accessory,
    .boxel-input-group[data-scopedcss-dbd745ef01-f153013829] >  .form-control {
      position: relative;
      z-index: 1;
      outline-offset: 0;
      margin: 0;
      min-height: inherit;
      box-shadow: none;
      border: none;
    }
    .boxel-input-group[data-scopedcss-dbd745ef01-f153013829] >  .button-accessory.kind-secondary {
      --boxel-button-color: var(--secondary, var(--boxel-100));
    }
    .boxel-input-group[data-scopedcss-dbd745ef01-f153013829]
      >  .button-accessory.kind-secondary:not(.disabled):hover {
      background-color: color-mix(
        in oklab,
        var(--boxel-button-color) 95%,
        var(--boxel-button-text-color)
      );
    }
    .boxel-input-group[data-scopedcss-dbd745ef01-f153013829] >  * + .button-accessory,
    .boxel-input-group[data-scopedcss-dbd745ef01-f153013829]
      >  .button-accessory + *:not(.button-accessory) {
      border-left: 1px solid var(--boxel-input-group-border-color);
    }
    .boxel-input-group[data-scopedcss-dbd745ef01-f153013829] >  .accessory:focus-visible,
    .boxel-input-group[data-scopedcss-dbd745ef01-f153013829] >  .form-control:focus-visible {
      z-index: 5;
    }
  }

  .boxel-input-group[data-scopedcss-dbd745ef01-f153013829]:not(:has(.accessory)):focus-within:not(
      .boxel-input-group--invalid
    ) {
    outline: 1px solid var(--ring, var(--boxel-highlight));
    border-color: var(--ring, var(--boxel-highlight));
  }
  [data-scopedcss-dbd745ef01-f153013829] .form-control:focus-visible,[data-scopedcss-dbd745ef01-f153013829] .accessory ~ .form-control:focus-visible {
    outline: 2px solid var(--ring, var(--boxel-highlight));
  }
  [data-scopedcss-dbd745ef01-f153013829] .form-control:not(:has(~ .accessory)) {
    outline: none;
  }

  .boxel-input-group--disabled[data-scopedcss-dbd745ef01-f153013829] .form-control,
  .boxel-input-group--disabled[data-scopedcss-dbd745ef01-f153013829] .text-accessory,
  .boxel-input-group--disabled[data-scopedcss-dbd745ef01-f153013829] .icon-button-accessory,
  .boxel-input-group--disabled[data-scopedcss-dbd745ef01-f153013829] .button-accessory {
    border-color: var(--boxel-input-group-border-color);
    opacity: 0.5;
  }

  .boxel-input-group[data-scopedcss-dbd745ef01-f153013829] > :last-child {
    border-top-right-radius: var(--boxel-input-group-inner-border-radius);
    border-bottom-right-radius: var(
      --boxel-input-group-inner-border-radius
    );
  }

  .boxel-input-group[data-scopedcss-dbd745ef01-f153013829] > :not(:last-child) {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }

  .boxel-input-group[data-scopedcss-dbd745ef01-f153013829] > :first-child {
    border-top-left-radius: var(--boxel-input-group-inner-border-radius);
    border-bottom-left-radius: var(--boxel-input-group-inner-border-radius);
  }

  .boxel-input-group[data-scopedcss-dbd745ef01-f153013829] > :not(:first-child) {
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }

  .helper-text[data-scopedcss-dbd745ef01-f153013829] {
    margin-top: var(--boxel-sp-xs);
    margin-left: var(--boxel-sp-xs);
    opacity: 0.75;
    font-size: var(--boxel-font-size-sm);
    letter-spacing: var(--boxel-lsp);
  }

  .boxel-input-group--invalid[data-scopedcss-dbd745ef01-f153013829]:not(.boxel-input-group--disabled) {
    box-shadow: 0 0 0 1px var(--destructive, var(--boxel-error-100));
  }

  .boxel-input-group--invalid:not(.boxel-input-group--disabled)
    .validation-icon-container[data-scopedcss-dbd745ef01-f153013829],
  .boxel-input-group--invalid[data-scopedcss-dbd745ef01-f153013829]:not(.boxel-input-group--disabled)
    .form-control,
  .boxel-input-group--invalid[data-scopedcss-dbd745ef01-f153013829]:not(.boxel-input-group--disabled)
    .text-accessory,
  .boxel-input-group--invalid[data-scopedcss-dbd745ef01-f153013829]:not(.boxel-input-group--disabled)
    .icon-button-accessory,
  .boxel-input-group--invalid[data-scopedcss-dbd745ef01-f153013829]:not(.boxel-input-group--disabled)
    .button-accessory {
    border-color: var(--destructive, var(--boxel-error-100));
  }

  .boxel-input-group--disabled ~ .error-message[data-scopedcss-dbd745ef01-f153013829],
  .boxel-input-group--disabled ~ .helper-text[data-scopedcss-dbd745ef01-f153013829] {
    display: none;
  }

  .error-message[data-scopedcss-dbd745ef01-f153013829] {
    margin-top: var(--boxel-sp-xxxs);
    margin-left: calc(var(--boxel-sp-sm) + 1px);
    color: var(--destructive, var(--boxel-error-200));
    font-size: var(--boxel-font-size-sm);
    font-weight: 500;
    letter-spacing: var(--boxel-lsp);
  }

  .validation-icon-container[data-scopedcss-dbd745ef01-f153013829] {
    display: flex;
    align-items: center;
    justify-content: center;
    user-select: none;
    width: var(--boxel-input-group-icon-length);
  }


  .boxel-message[data-scopedcss-63c406cc6e-e6dfd8e217] {
    /* Note: avatar size should not be set to be larger than 60px or smaller than 20px. */
    --boxel-message-avatar-size: 2.5rem; /* 40px. */
    --boxel-message-meta-height: 1.25rem; /* 20px */
    --boxel-message-gap: var(--boxel-sp);
    --boxel-message-margin-left: calc(
      var(--boxel-message-avatar-size) + var(--boxel-message-gap)
    );
  }

  .hide-meta[data-scopedcss-63c406cc6e-e6dfd8e217] {
    min-height: 0;
  }

  .meta[data-scopedcss-63c406cc6e-e6dfd8e217] {
    display: grid;
    grid-template-columns: var(--boxel-message-avatar-size) 1fr;
    grid-template-rows: var(--boxel-message-meta-height);
    align-items: start;
    gap: var(--boxel-message-gap);
  }

  .full-width .meta[data-scopedcss-63c406cc6e-e6dfd8e217] {
    align-items: center;
  }

  .avatar-img[data-scopedcss-63c406cc6e-e6dfd8e217] {
    width: var(--boxel-message-avatar-size);
    height: var(--boxel-message-avatar-size);
    border-radius: 100px;
  }

  .avatar-img--not-round[data-scopedcss-63c406cc6e-e6dfd8e217] {
    border-radius: initial;
  }

  .info[data-scopedcss-63c406cc6e-e6dfd8e217] {
    display: flex;
    white-space: nowrap;
    margin: 0;
    font: var(--boxel-font-sm);
    letter-spacing: var(--boxel-lsp-sm);
  }

  .name[data-scopedcss-63c406cc6e-e6dfd8e217] {
    margin-right: var(--boxel-sp);
    font-weight: 600;
  }

  .time[data-scopedcss-63c406cc6e-e6dfd8e217] {
    color: var(--boxel-500);
  }

  .content[data-scopedcss-63c406cc6e-e6dfd8e217] {
    /* mimic the grid using margins */
    margin-left: var(--boxel-message-margin-left);
    margin-top: 3px;
    line-height: 1.5;
  }

  .full-width .content[data-scopedcss-63c406cc6e-e6dfd8e217] {
    margin-left: 0;
    margin-top: var(--boxel-sp);
  }

  /* spacing for sequential thread messages */
  .boxel-message + .boxel-message[data-scopedcss-63c406cc6e-e6dfd8e217] {
    margin-top: var(--boxel-sp-xl);
  }

  .boxel-message + .hide-meta[data-scopedcss-63c406cc6e-e6dfd8e217] {
    margin-top: var(--boxel-sp);
  }


  dialog[data-scopedcss-48dec06694-9f04a14f2a] {
    /* Unit is required to be used on calc */
    --boxel-modal-offset-top: 0px;
    --boxel-modal-offset-left: 0px;
    --boxel-modal-offset-right: 0px;

    position: fixed;
    width: 100%;
    height: calc(100vh - var(--boxel-modal-offset-top));
    top: var(--boxel-modal-offset-top);
    left: var(--boxel-modal-offset-left);
    right: var(--boxel-modal-offset-right);
    padding: 0 var(--boxel-sp);
    background: none;
    border: none;
    overflow: hidden;
    z-index: var(--boxel-modal-z-index);
    pointer-events: none;
  }

  .centered[data-scopedcss-48dec06694-9f04a14f2a] {
    top: 50%;
    transform: translateY(-50%);
  }

  .overlay[data-scopedcss-48dec06694-9f04a14f2a] {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    border: none;
    background-color: var(--boxel-modal-overlay-color, rgb(39 45 48 / 50%));
    background-image: var(--boxel-modal-background-image-url);
    background-position: center;
    background-size: cover;
    text-align: left;
    z-index: calc(var(--boxel-modal-z-index) - 1);
  }

  .x-small[data-scopedcss-48dec06694-9f04a14f2a] {
    --boxel-modal-max-width: 23.25rem; /* 300px */
  }

  .small[data-scopedcss-48dec06694-9f04a14f2a] {
    --boxel-modal-max-width: 36.25rem; /* 580px */
  }

  .medium[data-scopedcss-48dec06694-9f04a14f2a] {
    --boxel-modal-max-width: 43.75rem; /* 700px */
  }

  .large[data-scopedcss-48dec06694-9f04a14f2a] {
    --boxel-modal-offset-top: var(--boxel-sp-lg);
    --boxel-modal-max-width: 65rem; /* 1040px */
  }

  .full-screen[data-scopedcss-48dec06694-9f04a14f2a] {
    padding: 0;
    top: 0;
    left: 0;
    right: 0;
  }

  .full-screen > .boxel-modal__inner[data-scopedcss-48dec06694-9f04a14f2a] {
    max-width: inherit;
  }

  .boxel-modal__inner {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    margin: auto;
    max-width: var(--boxel-modal-max-width, 65rem);
  }

  .boxel-modal__inner > * {
    width: 100%;
    pointer-events: auto;
    cursor: default;
  }


  .control-buttons[data-scopedcss-ce52917c7d-44efd12a80] {
    display: flex;
    justify-content: start;
    align-items: center;
    gap: var(--boxel-sp-xs);
    padding: var(--boxel-sp-xxxs) var(--boxel-sp-xs);
    border-top: 1px solid var(--boxel-100);
  }
  .control-button[data-scopedcss-ce52917c7d-44efd12a80] {
    flex-grow: 1;
  }


  @layer {
    .pill[data-scopedcss-a8584aac21-e920a3c78f] {
      /* internal properties */
      --pill-padding: var(--boxel-sp-5xs) var(--boxel-sp-xxxs);
      --pill-gap: var(--boxel-sp-5xs);
      --pill-border: 1px solid
        var(--boxel-pill-border-color, var(--pill-border-color));
      --pill-border-radius: var(--boxel-border-radius-sm);

      display: inline-flex;
      align-items: center;
      gap: var(--boxel-pill-gap, var(--pill-gap));
      max-width: 100%;
      padding: var(--boxel-pill-padding, var(--pill-padding));
      background-color: var(
        --boxel-pill-background-color,
        var(--pill-background-color)
      );
      color: var(--boxel-pill-font-color, var(--pill-font-color));
      border: var(--boxel-pill-border, var(--pill-border));
      border-radius: var(
        --boxel-pill-border-radius,
        var(--pill-border-radius)
      );
      font: var(
        --boxel-pill-font,
        var(--pill-font, 700 var(--boxel-font-xs))
      );
      font-family: inherit;
      letter-spacing: var(--boxel-lsp-xs);
      word-break: break-word;
      transition: var(
        --boxel-pill-transition,
        var(--boxel-transition-properties)
      );
    }

    .variant-default[data-scopedcss-a8584aac21-e920a3c78f] {
      --pill-background-color: var(--background, var(--boxel-light));
      --pill-font-color: var(--foreground, var(--boxel-dark));
      --pill-border-color: var(--border, var(--boxel-400));
    }

    .variant-primary[data-scopedcss-a8584aac21-e920a3c78f] {
      --pill-background-color: var(--primary, var(--boxel-highlight));
      --pill-font-color: var(--primary-foreground, var(--boxel-dark));
      --pill-border-color: var(--primary, var(--boxel-highlight));
    }

    .variant-secondary[data-scopedcss-a8584aac21-e920a3c78f] {
      --pill-background-color: var(--secondary, var(--boxel-light));
      --pill-font-color: var(--secondary-foreground, var(--boxel-dark));
      --pill-border-color: var(--secondary, var(--boxel-400));
    }

    .variant-muted[data-scopedcss-a8584aac21-e920a3c78f] {
      --pill-background-color: var(--muted, var(--boxel-200));
      --pill-font-color: var(--muted-foreground, var(--boxel-dark));
      --pill-border-color: var(--muted, var(--boxel-400));
    }

    .variant-accent[data-scopedcss-a8584aac21-e920a3c78f] {
      --pill-background-color: var(--accent, var(--boxel-100));
      --pill-font-color: var(--accent-foreground, var(--boxel-dark));
      --pill-border-color: var(--border, var(--boxel-400));
    }

    .variant-destructive[data-scopedcss-a8584aac21-e920a3c78f] {
      --pill-background-color: var(--destructive, var(--boxel-danger));
      --pill-font-color: var(--destructive-foreground, var(--boxel-light));
      --pill-border-color: var(--destructive, var(--boxel-danger));
    }

    .button-pill.variant-default[data-scopedcss-a8584aac21-e920a3c78f]:not(:disabled):hover,
    .button-pill.variant-primary[data-scopedcss-a8584aac21-e920a3c78f]:not(:disabled):hover,
    .button-pill.variant-destructive[data-scopedcss-a8584aac21-e920a3c78f]:not(:disabled):hover {
      background-color: color-mix(
        in srgb,
        var(--boxel-pill-background-color, var(--pill-background-color)) 90%,
        transparent
      );
    }

    .button-pill.variant-secondary[data-scopedcss-a8584aac21-e920a3c78f]:not(:disabled):hover,
    .button-pill.variant-muted[data-scopedcss-a8584aac21-e920a3c78f]:not(:disabled):hover {
      background-color: color-mix(
        in srgb,
        var(--boxel-pill-background-color, var(--pill-background-color)) 80%,
        transparent
      );
    }

    .button-pill.variant-default[data-scopedcss-a8584aac21-e920a3c78f]:not(:disabled):hover {
      --pill-background-color: var(--background, var(--boxel-100));
    }
    .button-pill.variant-primary[data-scopedcss-a8584aac21-e920a3c78f]:not(:disabled):hover {
      --pill-background-color: var(--primary, var(--boxel-highlight-hover));
      --pill-border-color: var(--pill-background-color);
    }
    .button-pill.variant-secondary[data-scopedcss-a8584aac21-e920a3c78f]:not(:disabled):hover {
      --pill-border-color: var(--secondary, var(--pill-font-color));
    }
    .button-pill.variant-destructive[data-scopedcss-a8584aac21-e920a3c78f]:not(:disabled):hover {
      --pill-background-color: var(--destructive, var(--boxel-danger-hover));
      --pill-border-color: var(--pill-background-color);
    }

    .icon[data-scopedcss-a8584aac21-e920a3c78f] {
      --icon-color: var(--pill-font-color, currentColor);
      flex-shrink: 0;
      display: inline-flex;
      min-width: var(--pill-icon-size);
      margin-block: 0;
      margin-inline: 0;
    }
  }


  .ember-power-select-multiple-option[data-scopedcss-86c03e0ac7-baa4fd799e] {
    all: unset;
  }
  .boxel-selected-option[data-scopedcss-86c03e0ac7-baa4fd799e] {
    --pill-gap: var(--boxel-sp-xxs);
  }
  .boxel-multi-select__remove-button[data-scopedcss-86c03e0ac7-baa4fd799e] {
    all: unset;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    border-radius: 50%;
    transition: background-color 0.2s ease;
    width: 10px;
    height: 10px;
  }
  .boxel-multi-select__icon--remove[data-scopedcss-86c03e0ac7-baa4fd799e] {
    width: 10px;
    height: 10px;
    --icon-color: var(--boxel-multi-select-pill-color);
  }


  .boxel-multi-select__remove-button[data-scopedcss-22fadaab4d-2dcd58f97b] {
    --boxel-multi-select-width: 10px;
    --boxel-multi-select-height: 10px;
    all: unset;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    border-radius: 50%;
    transition: background-color 0.2s ease;
    width: var(--boxel-multi-select-width);
    height: var(--boxel-multi-select-height);
  }
  .boxel-multi-select__icon--remove[data-scopedcss-22fadaab4d-2dcd58f97b] {
    width: var(--boxel-multi-select-width);
    height: var(--boxel-multi-select-height);
    --icon-color: var(--boxel-light);
  }
  .ember-power-select-multiple-remove-btn[data-scopedcss-22fadaab4d-2dcd58f97b] {
    display: none; /* We have to remove the default x button placed on selected items*/
  }
  .boxel-multi-select-has-more-item[data-scopedcss-22fadaab4d-2dcd58f97b] {
    --pill-gap: var(--boxel-sp-xxs);
    --pill-background-color: var(--boxel-700);
    --pill-font-color: var(--boxel-light);
  }
  .icon[data-scopedcss-22fadaab4d-2dcd58f97b] {
    width: 10px;
    height: 10px;
  }
  .is-open[data-scopedcss-22fadaab4d-2dcd58f97b] {
    transform: rotate(180deg);
  }


  .boxel-multi-select[data-scopedcss-7a8d0f423c-d41ca04ede] {
    position: relative;
    display: flex;
    align-items: stretch;
    overflow: hidden;
    border: 1px solid var(--boxel-border-color);
    border-radius: var(--boxel-border-radius-sm);
    max-width: 100%;
    width: 100%;
  }
  .ember-power-select-multiple-options[data-scopedcss-7a8d0f423c-d41ca04ede] {
    list-style: none;
    gap: var(--boxel-sp-xxxs);
    width: auto;
  }
  .ember-power-select-trigger[data-scopedcss-7a8d0f423c-d41ca04ede] {
    padding: 0;
  }


  @layer {
    .boxel-progress-bar[data-scopedcss-69d59dba07-e97e4840c1] {
      --progress-bar-background-color: var(
        --boxel-progress-bar-background-color,
        var(--muted, var(--boxel-light-200))
      );
      --progress-bar-border-radius: var(
        --boxel-progress-bar-border-radius,
        var(--boxel-border-radius-sm)
      );
      --progress-bar-fill-color: var(
        --boxel-progress-bar-fill-color,
        var(--primary, var(--boxel-highlight))
      );
      --progress-bar-font-color: var(
        --boxel-progress-bar-font-color,
        var(--primary-foreground, var(--boxel-light))
      );
      --progress-bar-border-color: var(
        --boxel-progress-bar-border-color,
        var(--border, var(--boxel-200))
      );
    }
    .progress-bar-container[data-scopedcss-69d59dba07-e97e4840c1] {
      height: 1.5em;
      width: 100%;
      background-color: var(--progress-bar-background-color);
      border-radius: var(--progress-bar-border-radius);
      position: relative;
      overflow: hidden;
      border: 1px solid var(--progress-bar-border-color);
    }
    .progress-bar-value[data-scopedcss-69d59dba07-e97e4840c1] {
      position: absolute;
      height: 100%;
      background-color: var(--progress-bar-fill-color);
      border-radius: var(--progress-bar-border-radius) 0 0
        var(--progress-bar-border-radius);
    }
    .progress-bar-info[data-scopedcss-69d59dba07-e97e4840c1],
    .progress-bar-info.end[data-scopedcss-69d59dba07-e97e4840c1] {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      display: flex;
      align-items: center;
      justify-content: end;
      gap: var(--boxel-sp-xxs);
      padding: var(--boxel-sp-5xs);
    }
    .progress-bar-info.start[data-scopedcss-69d59dba07-e97e4840c1] {
      justify-content: start;
    }
    .progress-bar-info.center[data-scopedcss-69d59dba07-e97e4840c1] {
      position: absolute;
      justify-content: center;
    }
    .progress-bar-label[data-scopedcss-69d59dba07-e97e4840c1] {
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      color: var(--progress-bar-font-color);
    }
  }


  @layer {
    .boxel-progress-radial[data-scopedcss-79cd0bc24a-cfe504194f] {
      --progress-radial-size: var(--boxel-progress-radial-size, 80px);
      --progress-radial-fill-color: var(
        --boxel-progress-radial-fill-color,
        var(--primary, var(--boxel-highlight))
      );
      --progress-radial-background-color: var(
        --boxel-progress-radial-background-color,
        var(--muted, var(--boxel-light-200))
      );
      --progress-radial-font-weight: var(
        --boxel-progress-radial-font-weight,
        600
      );
      --progress-radial-inner-bg: var(
        --boxel-progress-radial-inner-bg,
        var(--background, var(--boxel-light))
      );
      --progress-radial-text-color: var(
        --boxel-progress-radial-text-color,
        var(--foreground, var(--boxel-dark))
      );
    }
    .progress-radial-circle-outer[data-scopedcss-79cd0bc24a-cfe504194f] {
      width: var(--progress-radial-size);
      height: var(--progress-radial-size);
      border-radius: 50%;
      position: relative;
      background: conic-gradient(
        var(--progress-radial-fill-color) 0 var(--progressPercentage),
        var(--progress-radial-background-color) var(--progressPercentage)
          80.15%
      );
    }
    .progress-radial-circle-inner[data-scopedcss-79cd0bc24a-cfe504194f] {
      position: absolute;
      inset: 10px;
      background: var(--progress-radial-inner-bg);
      border-radius: 50%;
      display: grid;
      place-items: center;
    }

    .progress-percentage[data-scopedcss-79cd0bc24a-cfe504194f] {
      font-size: var(--boxel-font-sm);
      font-weight: var(--progress-radial-font-weight);
      color: var(--progress-radial-text-color);
    }
  }


  @layer {
    .boxel-radio-option[data-scopedcss-1ccb405467-72026a2ff1] {
      --radio-border: 1.5px solid
        var(
          --boxel-radio-border-color,
          var(--radio-foreground, var(--foreground, var(--boxel-dark))),
        );
      --radio-border-radius: var(--boxel-border-radius, 100px);
      --radio-background: var(
        --boxel-radio-background-color,
        var(--radio-background-color, var(--background, var(--boxel-light)))
      );
      --radio-foreground: var(
        --boxel-radio-foreground-color,
        var(--radio-foreground-color, var(--foreground, var(--boxel-dark)))
      );
      --radio-checked-background: var(
        --boxel-radio-checked-background-color,
        var(
          --radio-checked-background-color,
          var(--primary, var(--boxel-highlight))
        )
      );
      --radio-highlight: var(
        --boxel-radio-highlight-color,
        var(--radio-highlight-color, var(--primary, var(--boxel-highlight)))
      );
      --radio-disabled-border-color: var(
        --boxel-radio-disabled-border-color,
        var(
          --radio-disabled-border-color,
          var(--muted-foreground, var(--boxel-purple-300))
        )
      );

      position: relative;
      display: block;
      max-width: 100%;
      background-color: var(--radio-background);
      color: var(--radio-foreground);
      padding: var(--boxel-radio-input-option-padding);
      border-radius: var(--radio-border-radius);
      box-shadow: 0 0 0 1px var(--border, var(--boxel-200));
      transition: box-shadow var(--boxel-transition-properties);
    }

    .boxel-radio-option--hidden-border[data-scopedcss-1ccb405467-72026a2ff1] {
      box-shadow: 0 0 0 1px transparent;
    }

    .boxel-radio-option--has-radio[data-scopedcss-1ccb405467-72026a2ff1] {
      display: grid;
      grid-template-columns: auto 1fr;
      align-items: center;
      gap: var(--boxel-radio-input-option-gap);
    }

    .boxel-radio-option[data-scopedcss-1ccb405467-72026a2ff1]:hover:not(.boxel-radio-option--disabled) {
      box-shadow: 0 0 0 1px var(--boxel-dark);
      cursor: pointer;
    }

    .boxel-radio-option--checked[data-scopedcss-1ccb405467-72026a2ff1]:not(.boxel-radio-option--disabled),
    .boxel-radio-option[data-scopedcss-1ccb405467-72026a2ff1]:focus:not(.boxel-radio-option--disabled),
    .boxel-radio-option[data-scopedcss-1ccb405467-72026a2ff1]:focus-within:not(.boxel-radio-option--disabled) {
      box-shadow: 0 0 0 var(--boxel-outline-width) var(--radio-highlight);
      outline: 1px solid transparent;
    }

    .boxel-radio-option--disabled > *[data-scopedcss-1ccb405467-72026a2ff1] {
      opacity: 0.5;
    }

    .boxel-radio-option__input[data-scopedcss-1ccb405467-72026a2ff1] {
      position: relative;
      appearance: none;
      /* stylelint-disable-next-line property-no-vendor-prefix */
      -webkit-appearance: none;
      box-sizing: border-box;
      width: 1rem;
      height: 1rem;
      margin: 0;
      border: var(--radio-border);
      border-radius: 50%;
    }

    .boxel-radio-option__input--checked[data-scopedcss-1ccb405467-72026a2ff1] {
      background-color: var(--radio-checked-background);
      box-shadow: inset 0 0 0 0.1rem var(--radio-foreground);
    }

    .boxel-radio-option__input[data-scopedcss-1ccb405467-72026a2ff1]:disabled {
      border-color: var(--radio-disabled-border-color);
    }

    .boxel-radio-option__input[data-scopedcss-1ccb405467-72026a2ff1]:focus:not(:disabled) {
      outline: 1px solid transparent;
    }

    /* https://css-tricks.com/customise-radio-buttons-without-compromising-accessibility/ */
    .boxel-radio-option__input--hidden-radio[data-scopedcss-1ccb405467-72026a2ff1] {
      position: absolute;
      top: 0;
      left: 0;
      clip-path: polygon(0 0);
      width: 1px;
      height: 1px;
    }

    /* default focus class - can be overwritten by providing @focusedClass */
    .boxel-radio-option__focused-item[data-scopedcss-1ccb405467-72026a2ff1] {
      outline: 1px solid var(--boxel-outline-color);
    }

    .variant-muted[data-scopedcss-1ccb405467-72026a2ff1] {
      --radio-background-color: var(--muted, var(--boxel-200));
      --radio-foreground-color: var(--muted-foreground, var(--boxel-dark));
      --radio-checked-background: var(--muted, var(--boxel-200));
      --radio-highlight-color: var(--boxel-300);
    }

    /* stylelint-disable-next-line no-descending-specificity */
    .boxel-radio-input--invalid .boxel-radio-option[data-scopedcss-1ccb405467-72026a2ff1] {
      box-shadow: 0 0 0 1px var(--destructive, var(--boxel-error-100));
    }

    .boxel-radio-input--invalid .boxel-radio-option[data-scopedcss-1ccb405467-72026a2ff1]:focus {
      outline: 1px solid transparent; /* Make sure that we make the invalid state visible */
      box-shadow: 0 0 0 1.5px var(--destructive, var(--boxel-error-100));
    }

    .boxel-radio-input--invalid .boxel-radio-option[data-scopedcss-1ccb405467-72026a2ff1]:hover:not(:disabled) {
      box-shadow: 0 0 0 1px var(--destructive, var(--boxel-error-100));
    }
  }


  @layer {
    .boxel-radio-fieldset[data-scopedcss-78d9b41ea8-96350220c1] {
      --boxel-radio-gap: var(--boxel-sp);
      --boxel-radio-input-option-padding: var(--boxel-sp);
      --boxel-radio-input-option-gap: var(--boxel-sp-sm);
      border: 0;
      margin-inline: 0;
      padding: 0.01em 0 0;
      min-width: 0;
    }
    .boxel-radio-fieldset--compact[data-scopedcss-78d9b41ea8-96350220c1] {
      --boxel-radio-gap: var(--boxel-sp-xxs);
      --boxel-radio-input-option-padding: var(--boxel-sp-xxxs);
      --boxel-radio-input-option-gap: var(--boxel-sp-xxxs);
    }

    .boxel-radio-fieldset__legend[data-scopedcss-78d9b41ea8-96350220c1] {
      opacity: 0;
      position: absolute;
      left: -9999px;
      max-width: 1px;
      max-height: 1px;
      white-space: nowrap;
    }

    /* Div container inside the fieldset component. Use display: contents to move
these styles up when that css property is more widely available. */
    .boxel-radio-fieldset__container[data-scopedcss-78d9b41ea8-96350220c1] {
      display: flex;
      flex-wrap: wrap;
      gap: var(--boxel-radio-gap);
      width: 100%;
      max-width: 100%;
    }

    .boxel-radio-fieldset__container--vertical[data-scopedcss-78d9b41ea8-96350220c1] {
      flex-direction: column;
    }

    .boxel-radio-fieldset__container--horizontal > *[data-scopedcss-78d9b41ea8-96350220c1] {
      flex: 1;
    }
  }


  .separator[data-scopedcss-2184ad9d05-2f0f977ccd] {
    --boxel-panel-resize-handle-background-color: var(--boxel-450);
    --boxel-panel-resize-handle-hover-background-color: var(
      --boxel-highlight
    );

    display: flex;

    background: var(
      --boxel-panel-resize-separator-background-color,
      transparent
    );
    border: none;
    padding: 2px;
  }

  .separator-horizontal[data-scopedcss-2184ad9d05-2f0f977ccd] {
    --boxel-panel-resize-handle-height: 100px;
    --boxel-panel-resize-handle-width: 4px;

    align-items: center;
    cursor: col-resize;
  }

  .separator-vertical[data-scopedcss-2184ad9d05-2f0f977ccd] {
    --boxel-panel-resize-handle-width: 100px;
    --boxel-panel-resize-handle-height: 4px;

    justify-content: center;
    cursor: row-resize;
  }

  .resize-handle[data-scopedcss-2184ad9d05-2f0f977ccd] {
    width: var(--boxel-panel-resize-handle-width);
    height: var(--boxel-panel-resize-handle-height);

    border: none;
    border-radius: var(--boxel-border-radius-xl);
    padding: 0;
    background-color: var(--boxel-panel-resize-handle-background-color);

    position: relative;
    opacity: 0;
  }

  .separator:hover .resize-handle[data-scopedcss-2184ad9d05-2f0f977ccd],
  .separator.hover .resize-handle[data-scopedcss-2184ad9d05-2f0f977ccd] {
    opacity: 1;
  }

  .resize-handle[data-scopedcss-2184ad9d05-2f0f977ccd]:hover {
    background-color: var(
      --boxel-panel-resize-handle-hover-background-color
    );
  }


  .boxel-panel[data-scopedcss-408468ab5f-5672bf51b4] {
    overflow: hidden;
  }


  .boxel-panel-group[data-scopedcss-2bd5020f48-7427aef3a6] {
    display: flex;
    height: 100%;
    width: 100%;
    overflow: 'hidden';
  }
  .vertical[data-scopedcss-2bd5020f48-7427aef3a6] {
    flex-direction: column;
  }
  .horizontal[data-scopedcss-2bd5020f48-7427aef3a6] {
    flex-direction: row;
  }


  .boxel-skeleton-placeholder[data-scopedcss-eb19e1b179-9116bbc0e2] {
    --skeleton-background: var(
      --boxel-skeleton-background,
      var(--boxel-light-200)
    );
    --skeleton-highlight: var(
      --boxel-skeleton-highlight,
      var(--boxel-light-100)
    );
    --skeleton-width: var(--boxel-skeleton-width, 100%);
    --skeleton-height: var(--boxel-skeleton-height, 1.5em);
    --skeleton-border-radius: var(
      --boxel-skeleton-border-radius,
      var(--boxel-border-radius-sm)
    );
    width: var(--skeleton-width);
    height: var(--skeleton-height);
    border-radius: var(--skeleton-border-radius);
    background-color: var(--skeleton-background);
    position: relative;
    overflow: hidden;
  }

  .wave[data-scopedcss-eb19e1b179-9116bbc0e2]::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    animation: wave-data-scopedcss-eb19e1b179-9116bbc0e2 1.6s linear 0.5s infinite;
    background: linear-gradient(
      90deg,
      transparent,
      var(--skeleton-highlight),
      transparent
    );
    transform: translateX(-100%);
  }

  .pulse[data-scopedcss-eb19e1b179-9116bbc0e2] {
    animation: pulse-data-scopedcss-eb19e1b179-9116bbc0e2 1.5s ease-in-out 0.5s infinite;
  }

  @keyframes wave-data-scopedcss-eb19e1b179-9116bbc0e2 {
    0% {
      transform: translateX(-200%);
    }
    100% {
      transform: translateX(100%);
    }
  }

  @keyframes pulse-data-scopedcss-eb19e1b179-9116bbc0e2 {
    0% {
      opacity: 1;
    }
    50% {
      opacity: 0.4;
    }
    100% {
      opacity: 1;
    }
  }


  @layer boxelComponentL2 {
    .sort-options-group[data-scopedcss-d489a81038-94730a634e] {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: var(--boxel-sp-xxs) var(--boxel-sp-sm);
      text-wrap: nowrap;
    }
    .sort-options-label[data-scopedcss-d489a81038-94730a634e] {
      font-weight: 500;
    }
    .sort-button[data-scopedcss-d489a81038-94730a634e] {
      border-radius: var(--boxel-border-radius);
      min-width: 200px;
      justify-content: flex-start;
      padding-left: var(--boxel-sp-sm);
      padding-right: var(--boxel-sp-sm);
    }
    .sort-button > svg[data-scopedcss-d489a81038-94730a634e] {
      margin-left: auto;
    }
  }


  @layer {
    .switch[data-scopedcss-7786e4ecbe-fd3d3aa5cb] {
      width: 34px;
      height: 20px;
      border-radius: 20px;
      padding: 2.5px;
      display: inline-flex;
      align-items: center;
      transition: background-color 0.1s ease-in;
      position: relative;

      --switch-bg-color: var(--boxel-400);
      --switch-active-color: var(--primary, var(--boxel-dark-green));
      --switch-thumb-color: var(--boxel-light);

      background-color: var(--switch-bg-color);
    }

    input[type='checkbox'][data-scopedcss-7786e4ecbe-fd3d3aa5cb] {
      appearance: none;
    }

    .switch-input[data-scopedcss-7786e4ecbe-fd3d3aa5cb] {
      margin: 0;
      height: 100%;
      aspect-ratio: 1;
      background-color: var(--switch-thumb-color);
      border-radius: 50%;
      margin-left: 0;
      transition: margin-left 0.1s ease-in;
    }

    .switch.checked[data-scopedcss-7786e4ecbe-fd3d3aa5cb] {
      background-color: var(--switch-active-color);
    }

    .switch.checked .switch-input[data-scopedcss-7786e4ecbe-fd3d3aa5cb] {
      margin-left: 49%;
    }

    .switch[data-scopedcss-7786e4ecbe-fd3d3aa5cb]:hover,
    .switch-input[data-scopedcss-7786e4ecbe-fd3d3aa5cb]:hover {
      cursor: pointer;
    }

    .switch.disabled[data-scopedcss-7786e4ecbe-fd3d3aa5cb] {
      opacity: 0.5;
    }

    .switch.disabled[data-scopedcss-7786e4ecbe-fd3d3aa5cb],
    .switch.disabled .switch-input[data-scopedcss-7786e4ecbe-fd3d3aa5cb] {
      cursor: default;
    }
  }


  .app-header[data-scopedcss-5222d67a06-0ad6a1844e] {
    padding: 0 var(--boxel-sp-lg);
    background-color: var(--header-background-color, var(--boxel-light));
    color: var(--header-text-color, var(--boxel-dark));
  }
  .app-title-group[data-scopedcss-5222d67a06-0ad6a1844e] {
    padding: var(--boxel-sp-xs) 0;
    display: flex;
    align-items: center;
    gap: var(--boxel-sp-xs);
  }
  .app-title[data-scopedcss-5222d67a06-0ad6a1844e] {
    margin: 0;
    font: 900 var(--boxel-font);
    letter-spacing: var(--boxel-lsp-xl);
    text-transform: uppercase;
  }
  .app-content[data-scopedcss-5222d67a06-0ad6a1844e] {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--boxel-sp-lg);
  }
  .app-nav[data-scopedcss-5222d67a06-0ad6a1844e] {
    font: 500 var(--boxel-font-sm);
    letter-spacing: var(--boxel-lsp-sm);
    flex: 1;
  }
  .app-tab-list[data-scopedcss-5222d67a06-0ad6a1844e] {
    list-style-type: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: var(--boxel-sp);
    flex-flow: row wrap;
  }
  .app-tab-list a[data-scopedcss-5222d67a06-0ad6a1844e] {
    height: 100%;
    padding: var(--boxel-sp-xs) var(--boxel-sp-xxs);
    border-bottom: 4px solid transparent;
    transition:
      border-bottom-color 0.3s ease-in-out,
      font-weight 0.3s ease-in-out;
  }
  .app-tab-list a.active[data-scopedcss-5222d67a06-0ad6a1844e] {
    color: var(--header-text-color, var(--boxel-dark));
    border-bottom-color: var(--header-text-color, var(--boxel-dark));
    font-weight: 600;
  }
  .app-tab-list a[data-scopedcss-5222d67a06-0ad6a1844e]:hover:not(:disabled) {
    color: var(--header-text-color, var(--boxel-dark));
    font-weight: 600;
  }
  /* this prevents layout shift when text turns bold on hover/active */
  .app-tab-list a[data-scopedcss-5222d67a06-0ad6a1844e]::after {
    display: block;
    content: attr(data-test-tab-label);
    height: 0;
    visibility: hidden;
    user-select: none;
    pointer-events: none;
    font-weight: 600;
  }
  .app-side-content[data-scopedcss-5222d67a06-0ad6a1844e] {
    margin: var(--boxel-sp-xs) 0;
  }


  @layer {
    .tag-pill[data-scopedcss-faa4b3d9a0-1744407f02] {
      --pill-padding: var(--boxel-sp-5xs) var(--boxel-sp-xxxs);
      --pill-font: 500 var(--boxel-font-xs);
      letter-spacing: var(--boxel-lsp-sm);
      max-width: 100%;
      word-break: unset;
    }
    .ellipsize[data-scopedcss-faa4b3d9a0-1744407f02] {
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow: hidden;
    }
  }


  @layer {
    .tag-list[data-scopedcss-2ee77ed101-17f62e534f] {
      display: flex;
      flex-wrap: wrap;
      gap: var(--tag-list-gap, var(--boxel-sp-xs));
    }

    .tag-list-pill[data-scopedcss-2ee77ed101-17f62e534f] {
      --pill-background-color: var(
        --tag-list-pill-background-color,
        var(--boxel-light)
      );
      --pill-background-color-hover: var(
        --tag-list-pill-background-color-hover,
        var(--boxel-200)
      );
      --pill-font-color: var(--tag-list-pill-font-color, var(--boxel-dark));
      transition: var(--tag-list-pill-transition, all 0.2s ease);
    }

    .tag-list-pill.selected[data-scopedcss-2ee77ed101-17f62e534f] {
      --pill-background-color: var(
        --tag-list-pill-selected-background-color,
        var(--boxel-dark)
      );
      --pill-background-color-hover: var(
        --tag-list-pill-selected-background-color,
        var(--boxel-dark)
      );
      --pill-font-color: var(
        --tag-list-pill-selected-font-color,
        var(--boxel-light)
      );
    }
  }


  @layer {
    .view-options-group[data-scopedcss-8689ec5aa9-c67c3c090e] {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      column-gap: var(
        --boxel-view-option-group-column-gap,
        var(--boxel-sp-sm)
      );
      row-gap: var(--boxel-view-option-group-row-gap);
      text-wrap: nowrap;
    }
    .view-options-label[data-scopedcss-8689ec5aa9-c67c3c090e] {
      font-weight: 500;
    }
    .view-options[data-scopedcss-8689ec5aa9-c67c3c090e] {
      display: flex;
      column-gap: var(--boxel-view-option-column-gap, var(--boxel-sp-6xs));
      row-gap: var(--boxel-view-option-row-gap);
    }
    .view-option[data-scopedcss-8689ec5aa9-c67c3c090e] {
      display: flex;
      background-color: var(--boxel-view-option-background, transparent);
      color: var(
        --boxel-view-option-foreground,
        color-mix(
          in oklab,
          var(--foreground, var(--boxel-dark)) 42%,
          transparent
        )
      );
      border-radius: var(
        --boxel-view-option-radius,
        var(--boxel-border-radius-sm)
      );
      box-shadow: var(--boxel-view-option-shadow, none);
      transition: var(--boxel-view-option-transition, none);
      flex-shrink: 0;
    }
    .view-options[data-scopedcss-8689ec5aa9-c67c3c090e] >  div,
    .view-option[data-scopedcss-8689ec5aa9-c67c3c090e] >  div {
      display: contents;
    }
    .view-option[data-scopedcss-8689ec5aa9-c67c3c090e]:not(:has(:disabled)):hover {
      background-color: var(
        --boxel-view-option-hover-background,
        transparent
      );
      color: var(--boxel-view-option-hover-foreground, var(--foreground));
    }
    .view-option.is-selected[data-scopedcss-8689ec5aa9-c67c3c090e] {
      background-color: var(
        --boxel-view-option-selected-background,
        transparent
      );
      color: var(
        --boxel-view-option-selected-foreground,
        var(--foreground, var(--boxel-dark))
      );
    }
    .view-option.is-selected[data-scopedcss-8689ec5aa9-c67c3c090e]:hover {
      background-color: var(
        --boxel-view-option-selected-hover-background,
        transparent
      );
      color: var(
        --boxel-view-option-selected-hover-foreground,
        color-mix(
          in oklab,
          var(--foreground, var(--boxel-dark)) 90%,
          transparent
        )
      );
    }
    .view-option[data-scopedcss-8689ec5aa9-c67c3c090e]:focus-within:has(input:focus-visible) {
      outline: 2px solid var(--ring, var(--boxel-highlight));
    }
    .view-option[data-scopedcss-8689ec5aa9-c67c3c090e]:has(:disabled) {
      opacity: 0.5;
      pointer-events: none;
    }
    .is-disabled[data-scopedcss-8689ec5aa9-c67c3c090e] {
      opacity: 0.5;
    }
  }

:root {
  --ember-power-calendar-cell-size: 35px;
}

.ember-power-calendar {
  box-sizing: border-box;
  position: relative;
  font-size: 14px;
  line-height: 1.4286;
}

.ember-power-calendar-nav {
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  line-height: 2;
}

.ember-power-calendar-nav * {
  box-sizing: border-box;
}

.ember-power-calendar-days,
.ember-power-calendar-days * {
  box-sizing: border-box;
}

.ember-power-calendar-nav-title {
  flex: 1;
  text-align: center;
}

.ember-power-calendar-row {
  display: flex;
  justify-content: space-between;
}

.ember-power-calendar-weekday {
  appearance: none;
  flex: 1 1 100%;
  background-color: transparent;
  background-color: initial;
  border: none;
  border: initial;
  outline: none;
  outline: initial;
  justify-content: center;
  display: flex;
  align-items: center;
  padding: 0;
}

.ember-power-calendar-day {
  appearance: none;
  background-color: transparent;
  background-color: initial;
  border: none;
  border: initial;
  outline: none;
  outline: initial;
  flex: 1 1 100%;
  font-size: inherit;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.ember-power-calendar-nav-control {
  appearance: none;
  background-color: transparent;
  background-color: initial;
  border: none;
  border: initial;
  outline: none;
  outline: initial;
  line-height: 1;
  font-size: 150%;
}
.ember-power-calendar-nav-control:focus {
  transform: scale(1.2);
}

.ember-power-calendar-day--selected,
.ember-power-calendar-day--selected:not([disabled]):hover {
  font-weight: bold;
}

.ember-power-calendar-day--interactive[disabled] {
  opacity: 0.4;
}

.ember-power-calendar {
  width: calc(calc(var(--ember-power-calendar-cell-size) + 2px) * 7 - 2px + 0px + 0px);
}
.ember-power-calendar .ember-power-calendar-week:first-child[data-missing-days="1"] {
  padding-left: calc(calc(var(--ember-power-calendar-cell-size) + 2px) * 1);
}
.ember-power-calendar .ember-power-calendar-week:first-child[data-missing-days="2"] {
  padding-left: calc(calc(var(--ember-power-calendar-cell-size) + 2px) * 2);
}
.ember-power-calendar .ember-power-calendar-week:first-child[data-missing-days="3"] {
  padding-left: calc(calc(var(--ember-power-calendar-cell-size) + 2px) * 3);
}
.ember-power-calendar .ember-power-calendar-week:first-child[data-missing-days="4"] {
  padding-left: calc(calc(var(--ember-power-calendar-cell-size) + 2px) * 4);
}
.ember-power-calendar .ember-power-calendar-week:first-child[data-missing-days="5"] {
  padding-left: calc(calc(var(--ember-power-calendar-cell-size) + 2px) * 5);
}
.ember-power-calendar .ember-power-calendar-week:first-child[data-missing-days="6"] {
  padding-left: calc(calc(var(--ember-power-calendar-cell-size) + 2px) * 6);
}
.ember-power-calendar .ember-power-calendar-week:last-child[data-missing-days="1"] {
  padding-right: calc(calc(var(--ember-power-calendar-cell-size) + 2px) * 1);
}
.ember-power-calendar .ember-power-calendar-week:last-child[data-missing-days="2"] {
  padding-right: calc(calc(var(--ember-power-calendar-cell-size) + 2px) * 2);
}
.ember-power-calendar .ember-power-calendar-week:last-child[data-missing-days="3"] {
  padding-right: calc(calc(var(--ember-power-calendar-cell-size) + 2px) * 3);
}
.ember-power-calendar .ember-power-calendar-week:last-child[data-missing-days="4"] {
  padding-right: calc(calc(var(--ember-power-calendar-cell-size) + 2px) * 4);
}
.ember-power-calendar .ember-power-calendar-week:last-child[data-missing-days="5"] {
  padding-right: calc(calc(var(--ember-power-calendar-cell-size) + 2px) * 5);
}
.ember-power-calendar .ember-power-calendar-week:last-child[data-missing-days="6"] {
  padding-right: calc(calc(var(--ember-power-calendar-cell-size) + 2px) * 6);
}
.ember-power-calendar .ember-power-calendar-day,
.ember-power-calendar .ember-power-calendar-weekday {
  max-width: var(--ember-power-calendar-cell-size);
  max-height: var(--ember-power-calendar-cell-size);
  width: var(--ember-power-calendar-cell-size);
  height: var(--ember-power-calendar-cell-size);
}
.ember-power-calendar .ember-power-calendar-weekdays,
.ember-power-calendar .ember-power-calendar-week {
  height: calc(var(--ember-power-calendar-cell-size) + 2px);
  padding-left: 0px;
  padding-right: 0px;
}
.ember-power-calendar .ember-power-calendar-day {
  color: #bbb;
}
.ember-power-calendar .ember-power-calendar-weekdays {
  color: #333333;
}
.ember-power-calendar .ember-power-calendar-nav-control {
  color: #0078c9;
}
.ember-power-calendar .ember-power-calendar-nav-control:focus {
  color: rgb(48, 171.5820895522, 255);
}
.ember-power-calendar .ember-power-calendar-day--current-month {
  color: #656d78;
  background-color: #f5f7fa;
}
.ember-power-calendar .ember-power-calendar-day--today {
  background-color: #eee;
}
.ember-power-calendar .ember-power-calendar-day:not([disabled]):hover {
  background-color: #eee;
}
.ember-power-calendar .ember-power-calendar-day--focused {
  box-shadow: inset 0 -2px 0 0 #0078c9;
}
.ember-power-calendar .ember-power-calendar-day--selected.ember-power-calendar-day--range-start {
  background-color: rgb(150, 212.6865671642, 255);
}
.ember-power-calendar .ember-power-calendar-day--selected.ember-power-calendar-day--range-start:hover {
  background-color: rgb(150, 212.6865671642, 255);
}
.ember-power-calendar .ember-power-calendar-day--selected.ember-power-calendar-day--range-end {
  background-color: rgb(150, 212.6865671642, 255);
}
.ember-power-calendar .ember-power-calendar-day--selected.ember-power-calendar-day--range-end:hover {
  background-color: rgb(150, 212.6865671642, 255);
}
.ember-power-calendar .ember-power-calendar-day--selected {
  background-color: rgb(201, 233.2388059701, 255);
  color: #656d78;
}
.ember-power-calendar .ember-power-calendar-day--selected:not([disabled]):hover {
  background-color: rgb(201, 233.2388059701, 255);
  color: #656d78;
}
.ember-power-calendar .ember-power-calendar-day--other-month:not([disabled]):hover {
  color: #656d78;
}
.ember-basic-dropdown {
  position: relative;
}

.ember-basic-dropdown,
.ember-basic-dropdown-content,
.ember-basic-dropdown-content * {
  box-sizing: border-box;
}

.ember-basic-dropdown-content {
  position: absolute;
  width: auto;
  z-index: 1000;
  background-color: #ffffff;
}

.ember-basic-dropdown-content--left {
  left: 0;
}

.ember-basic-dropdown-content--right {
  right: 0;
}

.ember-basic-dropdown-overlay {
  position: fixed;
  background: rgba(0, 0, 0, 0.5);
  width: 100%;
  height: 100%;
  z-index: 10;
  top: 0;
  left: 0;
  pointer-events: none;
}

.ember-basic-dropdown-content-wormhole-origin {
  display: inline;
}

.ember-power-select-dropdown * {
  box-sizing: border-box;
}

.ember-power-select-trigger {
  position: relative;
  border-top: 1px solid #aaaaaa;
  border-bottom: 1px solid #aaaaaa;
  border-right: 1px solid #aaaaaa;
  border-left: 1px solid #aaaaaa;
  border-radius: 4px;
  background-color: #ffffff;
  line-height: 1.75;
  overflow-x: hidden;
  text-overflow: ellipsis;
  min-height: 1.75em;
  user-select: none;
  -webkit-user-select: none;
  color: inherit;
  /* Minimum clearfix for modern browsers */
}
.ember-power-select-trigger:after {
  content: "";
  display: table;
  clear: both;
}
.ember-power-select-trigger:not(.ember-power-select-multiple-trigger) .ember-power-select-input {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.ember-power-select-trigger:focus,
.ember-power-select-trigger--active {
  border-top: 1px solid #aaaaaa;
  border-bottom: 1px solid #aaaaaa;
  border-right: 1px solid #aaaaaa;
  border-left: 1px solid #aaaaaa;
  box-shadow: none;
}

.ember-basic-dropdown-trigger--below.ember-power-select-trigger[aria-expanded=true],
.ember-basic-dropdown-trigger--in-place.ember-power-select-trigger[aria-expanded=true] {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.ember-basic-dropdown-trigger--above.ember-power-select-trigger[aria-expanded=true] {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.ember-power-select-placeholder {
  color: #999999;
  display: block;
  overflow-x: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.ember-power-select-status-icon {
  position: absolute;
  display: inline-block;
  width: 0;
  height: 0;
  top: 0;
  bottom: 0;
  margin: auto;
  border-style: solid;
  border-width: 7px 4px 0 4px;
  border-color: #aaaaaa transparent transparent transparent;
}
.ember-basic-dropdown-trigger[aria-expanded=true] .ember-power-select-status-icon {
  transform: rotate(180deg);
}

.ember-power-select-clear-btn {
  position: absolute;
  cursor: pointer;
}

.ember-power-select-multiple-options {
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  list-style: none;
}
.ember-power-select-multiple-options li.ember-power-select-trigger-multiple-input-container {
  flex-grow: 1;
  display: flex;
}
.ember-power-select-multiple-options li.ember-power-select-trigger-multiple-input-container input {
  flex-grow: 1;
}

.ember-power-select-trigger-multiple-input {
  font-family: inherit;
  font-size: inherit;
  border: none;
  line-height: inherit;
  -webkit-appearance: none;
  outline: none;
  padding: 0;
  background-color: transparent;
  text-indent: 2px;
}
.ember-power-select-trigger-multiple-input:disabled {
  background-color: #eeeeee;
}
.ember-power-select-trigger-multiple-input {
  /* There's a browser bug where this selectos cannot be chained with commas */
}
.ember-power-select-trigger-multiple-input::placeholder {
  opacity: 1;
  color: #999999;
}
.ember-power-select-trigger-multiple-input::-webkit-input-placeholder {
  opacity: 1;
  color: #999999;
}
.ember-power-select-trigger-multiple-input::-moz-placeholder {
  opacity: 1;
  color: #999999;
}
.ember-power-select-trigger-multiple-input::-ms-input-placeholder {
  opacity: 1;
  color: #999999;
}

.ember-power-select-multiple-option {
  border: 1px solid gray;
  border-radius: 4px;
  color: #333333;
  background-color: #e4e4e4;
  padding: 0 4px;
  line-height: 1.45;
  margin: 2px 0 2px 3px;
}

.ember-power-select-multiple-remove-btn {
  cursor: pointer;
}
.ember-power-select-multiple-remove-btn:not(:hover) {
  opacity: 0.5;
}

.ember-power-select-search {
  padding: 4px;
}

.ember-power-select-search-input {
  border: 1px solid #aaaaaa;
  border-radius: 0;
  width: 100%;
  font-size: inherit;
  line-height: inherit;
  padding: 0 5px;
}
.ember-power-select-search-input:focus {
  border: 1px solid #aaaaaa;
  box-shadow: none;
}

.ember-power-select-search-input-field {
  width: 100%;
  height: 100%;
  padding: 0 8px;
  font-family: inherit;
  font-size: inherit;
  border: none;
  display: block;
  line-height: inherit;
  -webkit-appearance: none;
  outline: none;
  background-color: transparent;
}

.ember-power-select-dropdown {
  border-left: 1px solid #aaaaaa;
  border-right: 1px solid #aaaaaa;
  line-height: 1.75;
  border-radius: 4px;
  box-shadow: none;
  overflow: hidden;
  color: inherit;
}

.ember-power-select-dropdown.ember-basic-dropdown-content--above {
  border-top: 1px solid #aaaaaa;
  border-bottom: none;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.ember-power-select-dropdown.ember-basic-dropdown-content--below,
.ember-power-select-dropdown.ember-basic-dropdown-content--in-place {
  border-top: none;
  border-bottom: 1px solid #aaaaaa;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.ember-power-select-dropdown.ember-basic-dropdown-content--in-place {
  width: 100%;
}

.ember-power-select-options {
  list-style: none;
  margin: 0;
  padding: 0;
  user-select: none;
  -webkit-user-select: none;
}
.ember-power-select-options[role=listbox] {
  overflow-y: auto; /* in firefox in windows this can cause a word-break issue. Try `overflow-y: scroll` if that happens */
  -webkit-overflow-scrolling: touch;
  max-height: 12.25em;
}

.ember-power-select-option {
  cursor: pointer;
  padding: 0 8px;
}

.ember-power-select-group[aria-disabled=true] {
  color: #999999;
  cursor: not-allowed;
}

.ember-power-select-group[aria-disabled=true] .ember-power-select-option,
.ember-power-select-option[aria-disabled=true] {
  color: #999999;
  pointer-events: none;
  cursor: not-allowed;
}

.ember-power-select-option[aria-selected=true] {
  background-color: #dddddd;
}

.ember-power-select-option[aria-current=true] {
  background-color: #5897fb;
  color: #ffffff;
}

.ember-power-select-group-name {
  cursor: default;
  font-weight: bold;
}

.ember-power-select-trigger[aria-disabled=true] {
  background-color: #eeeeee;
}

.ember-power-select-trigger {
  padding: 0 16px 0 0;
}

.ember-power-select-selected-item,
.ember-power-select-placeholder {
  margin-left: 8px;
}

.ember-power-select-status-icon {
  right: 5px;
}

.ember-power-select-clear-btn {
  right: 25px;
}

.ember-power-select-group .ember-power-select-group .ember-power-select-group-name {
  padding-left: 24px;
}
.ember-power-select-group .ember-power-select-group .ember-power-select-option {
  padding-left: 40px;
}
.ember-power-select-group .ember-power-select-option {
  padding-left: 24px;
}
.ember-power-select-group .ember-power-select-group-name {
  padding-left: 8px;
}

.ember-power-select-trigger[dir=rtl] {
  padding: 0 0 0 16px;
}
.ember-power-select-trigger[dir=rtl] .ember-power-select-selected-item,
.ember-power-select-trigger[dir=rtl] .ember-power-select-placeholder {
  margin-right: 8px;
}
.ember-power-select-trigger[dir=rtl] .ember-power-select-multiple-option {
  float: right;
}
.ember-power-select-trigger[dir=rtl] .ember-power-select-trigger-multiple-input {
  float: right;
}
.ember-power-select-trigger[dir=rtl] .ember-power-select-status-icon {
  left: 5px;
  right: initial;
}
.ember-power-select-trigger[dir=rtl] .ember-power-select-clear-btn {
  left: 25px;
  right: initial;
}

.ember-power-select-visually-hidden {
  height: 1px;
  left: -9999px;
  overflow: hidden;
  position: absolute;
  width: 1px;
}

.ember-power-select-dropdown[dir=rtl] .ember-power-select-group .ember-power-select-group .ember-power-select-group-name {
  padding-right: 24px;
}
.ember-power-select-dropdown[dir=rtl] .ember-power-select-group .ember-power-select-group .ember-power-select-option {
  padding-right: 40px;
}
.ember-power-select-dropdown[dir=rtl] .ember-power-select-group .ember-power-select-option {
  padding-right: 24px;
}
.ember-power-select-dropdown[dir=rtl] .ember-power-select-group .ember-power-select-group-name {
  padding-right: 8px;
}

  .card[data-scopedcss-a56f340702-fd4b2398e9] {
    container-name: fitted-card;
    container-type: size;
    overflow: hidden;
  }
  .wide[data-scopedcss-a56f340702-fd4b2398e9] {
    grid-column: span 2;
  }
  .full-width[data-scopedcss-a56f340702-fd4b2398e9] {
    grid-column: -1 / 1;
  }
  .item[data-scopedcss-a56f340702-fd4b2398e9] {
    position: relative;
    padding-top: 50px;
    padding-inline: var(--boxel-sp);
    padding-bottom: var(--boxel-sp);
    background-color: color-mix(
      in oklab,
      var(--background, var(--boxel-light)) 90%,
      var(--foreground, var(--boxel-dark))
    );
  }
  .desc[data-scopedcss-a56f340702-fd4b2398e9] {
    position: absolute;
    top: 0;
    right: 0;
    padding: var(--boxel-sp-4xs);
    background-color: var(--boxel-light);
    border-left: var(--boxel-border-card);
    border-right: var(--boxel-border-card);
    border-bottom: var(--boxel-border-card);
    color: var(--muted-foreground, var(--boxel-450));
    font: var(--boxel-font-xs);
  }
  h4[data-scopedcss-a56f340702-fd4b2398e9] {
    margin: 0;
    font-weight: 500;
  }


  .scroller[data-scopedcss-a56f340702-aca6953ee8] {
    max-height: 40vh;
    overflow-y: scroll;
    border: 1px solid var(--border, var(--boxel-200));
    padding: 10px;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: var(--boxel-sp-xs);
  }
  h3[data-scopedcss-a56f340702-aca6953ee8] {
    grid-column: -1 / 1;
    font-weight: 500;
  }


  .boxel-button-usage[data-scopedcss-feab41e621-4dfe6e3a62] {
    --boxel-border-radius: 100px;
  }
  [data-scopedcss-feab41e621-4dfe6e3a62] .FreestyleUsage-preview {
    border-radius: 10px;
  }

  .usage-button-container[data-scopedcss-feab41e621-4dfe6e3a62] {
    display: flex;
    flex-wrap: wrap;
  }

  .usage-button-explanation[data-scopedcss-feab41e621-4dfe6e3a62] {
    border: 1px solid black;
    border-collapse: collapse;
    margin-top: 1rem;
  }

  .usage-button-explanation td[data-scopedcss-feab41e621-4dfe6e3a62] {
    border: 1px solid black;
    padding: 0.25rem;
  }

  .usage-button-centers-component[data-scopedcss-feab41e621-4dfe6e3a62] {
    flex-basis: 0;
    flex-grow: 99;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100%;
    padding: 2rem;
    background-color: var(--background, var(--boxel-light));
    color: var(--foreground, var(--boxel-dark));
  }

  .usage-button-dark-mode-background[data-scopedcss-feab41e621-4dfe6e3a62] {
    background-color: var(--foreground, var(--boxel-700));
    color: var(--background, var(--boxel-light));
  }

  [data-scopedcss-feab41e621-4dfe6e3a62] .FreestyleUsageCssVar input {
    display: none;
  }


  .header-freestyle-container {
    --boxel-card-header-text-transform: none;
  }


  .example-container[data-scopedcss-0d7c283f6e-dc00c55812] {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 30px;
    width: 30px;
  }


  [data-scopedcss-00b6aa661f-3cbbcdb92e] .FreestyleUsageArgument-default.u-codePill {
    word-break: break-word;
  }


  .dnd-wrapper[data-scopedcss-d23fd16214-8a065ba328] {
    height: 600px;
  }
  .custom-card[data-scopedcss-d23fd16214-8a065ba328] {
    padding: var(--boxel-sp);
  }
  .column-info[data-scopedcss-d23fd16214-8a065ba328] {
    display: table;
    margin-left: auto;
  }


  @layer {
    .boxel-dropdown-trigger[data-scopedcss-9c04058d1d-5fae1be72c] {
      border: 0;
      padding: 0;
      border-radius: 0;
      font-weight: 600;
      font-size: var(--boxel-font-size);
      justify-content: flex-start;
    }

    .boxel-dropdown-trigger--showing-placeholder[data-scopedcss-9c04058d1d-5fae1be72c] {
      color: var(--boxel-purple-300);
    }

    .boxel-dropdown-trigger__icon[data-scopedcss-9c04058d1d-5fae1be72c] {
      --icon-color: var(--boxel-highlight);

      width: var(--boxel-icon-sm);
      height: var(--boxel-icon-sm);
      margin-right: var(--boxel-sp-xxs);
    }

    .boxel-dropdown-trigger__caret[data-scopedcss-9c04058d1d-5fae1be72c] {
      --icon-color: var(--boxel-purple-200);
      margin-left: var(--boxel-sp-xxs);
    }
  }


  .avatar[data-scopedcss-8140fa3e36-0791bc190e] {
    --profile-avatar-icon-size: 20px;
    --profile-avatar-icon-border: 0px;
    flex-shrink: 0;
  }
  .primary-tag[data-scopedcss-8140fa3e36-0791bc190e] {
    --pill-font-weight: 400;
    --pill-padding: var(--boxel-sp-5xs) var(--boxel-sp-xxs);
    --pill-font: 400 var(--boxel-font-xs);
    --pill-border: none;
  }


  .filter-usage[data-scopedcss-520df101f9-179c324ed8] {
    display: grid;
    grid-template-columns: 250px 1fr;
    gap: var(--boxel-sp-sm);
  }
  [data-scopedcss-520df101f9-179c324ed8] .FreestyleUsageCssVar input {
    display: none;
  }


  .definition-container[data-scopedcss-ce08604fcd-5af91b6176] {
    --boxel-header-min-height: 1.56rem;
    --boxel-header-padding: var(--boxel-sp-5xs) var(--boxel-sp-xs);
    --boxel-header-background-color: var(--boxel-300);
    --boxel-header-text-color: var(--boxel-dark);

    font: 500 var(--boxel-font-xs);
    letter-spacing: var(--boxel-lsp-xl);
    text-transform: uppercase;
  }


  .checkbox-label[data-scopedcss-2bf59f3112-41e5b01ad6] {
    display: flex;
    align-items: center;
    margin-bottom: var(--boxel-sp);
    gap: var(--boxel-sp-xxs);
  }

  .all-icons[data-scopedcss-2bf59f3112-41e5b01ad6] {
    display: flex;
    flex-wrap: wrap;
  }

  .icon-and-label[data-scopedcss-2bf59f3112-41e5b01ad6] {
    display: flex;
    width: 15rem;
    flex-direction: column;
    align-items: center;
    margin: 0 10px 10px 0;
  }

  .hide-icon-overflow .icon[data-scopedcss-2bf59f3112-41e5b01ad6] {
    overflow: hidden;
  }

  .show-borders .icon[data-scopedcss-2bf59f3112-41e5b01ad6] {
    border: 1px solid var(--boxel-500);
    width: calc(var(--boxel-icon-button-width) + 2px);
    height: calc(var(--boxel-icon-button-height) + 2px);
  }

  .dark-background[data-scopedcss-2bf59f3112-41e5b01ad6] .FreestyleUsage-preview {
    background-color: var(--foreground, var(--boxel-700));
    color: var(--background, var(--boxel-light));
  }

  [data-scopedcss-2bf59f3112-41e5b01ad6] .FreestyleUsageCssVar input {
    display: none;
  }


  .boxel-input-usage-examples .boxel-input-group[data-scopedcss-14121b20a0-0e96a019ce] {
    margin-bottom: var(--boxel-sp-xl);
  }


  .card-container[data-scopedcss-695db6a551-641146b568] {
    background-color: var(--card);
    color: var(--card-foreground);
  }
  .sidebar-container[data-scopedcss-695db6a551-641146b568] {
    background-color: var(--sidebar);
    color: var(--sidebar-foreground);
  }
  [data-scopedcss-695db6a551-641146b568] .FreestyleUsageCssVar input {
    display: none;
  }


  .checkbox-indicator[data-scopedcss-3f063072a2-d3a2fa6ced] {
    width: 16px;
    height: 16px;
    border: 1px solid var(--boxel-500);
    border-radius: 3px;
    margin-right: var(--boxel-sp-xs);
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .checkbox-indicator[data-scopedcss-3f063072a2-d3a2fa6ced]:hover,
  .checkbox-indicator[data-scopedcss-3f063072a2-d3a2fa6ced]:focus {
    box-shadow: 0 0 0 2px var(--boxel-dark-teal);
  }
  .check-icon[data-scopedcss-3f063072a2-d3a2fa6ced] {
    --icon-color: var(--boxel-dark-teal);
    visibility: collapse;
    display: contents;
  }
  .check-icon--selected[data-scopedcss-3f063072a2-d3a2fa6ced] {
    visibility: visible;
  }


  .assignee-pill[data-scopedcss-3f063072a2-d9bd50564f] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: var(--boxel-font-size-sm);
    cursor: pointer;
    width: 100%;
  }
  .assignee-pill.selected[data-scopedcss-3f063072a2-d9bd50564f] {
    background-color: var(--boxel-highlight);
  }
  .assignee-pill-content[data-scopedcss-3f063072a2-d9bd50564f] {
    display: flex;
    align-items: center;
    gap: var(--boxel-sp-4xs);
  }
  .assignee-avatar[data-scopedcss-3f063072a2-d9bd50564f] {
    width: var(--boxel-sp-sm);
    height: var(--boxel-sp-sm);
    border-radius: 50%;
    background-color: var(--avatar-bg-color, var(--boxel-light));
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: var(--boxel-sp-xs);
    font-size: var(--boxel-font-size-xs);
  }
  .assignee-name[data-scopedcss-3f063072a2-d9bd50564f] {
    flex-grow: 1;
  }
  .assignee-issues[data-scopedcss-3f063072a2-d9bd50564f] {
    color: var(--boxel-dark-teal);
    font-size: var(--boxel-font-size-xs);
  }


  .spec-tag-pill[data-scopedcss-6e7360a8c3-ad430d8b0e] {
    --boxel-pill-font: 500 var(--boxel-font-xs);
    word-break: initial;
    text-transform: uppercase;
  }


  .panel[data-scopedcss-6e875c24c3-1d3c489c2f] {
    background-color: var(--boxel-200);
  }

  .vertical-container[data-scopedcss-6e875c24c3-1d3c489c2f] {
    height: 30rem;
  }


  [data-scopedcss-4d6e59251e-48eb46dc83] .FreestyleUsage-preview {
    background-color: var(--boxel-light);
  }

  [data-scopedcss-4d6e59251e-48eb46dc83] .FreestyleUsage-preview input {
    border: none;
  }


  .tag-usage-container[data-scopedcss-45766f3a53-17bfb024d4] {
    width: 100px; /* for previewing the ellipsize property */
  }


  [data-scopedcss-9f36d880d7-18c46905d5] .FreestyleUsageCssVar input {
    display: none;
  }